WordPress.com Connect

Ce texte a été traduit à l’aide de l’IA. Si vous souhaitez consulter le texte original en anglais, cliquez ici.

WordPress.com Connect est une solution d’authentification simplifiée conçue spécifiquement pour la fonctionnalité « Se connecter avec WordPress.com ». Elle offre aux millions d’utilisateurs et utilisatrices de WordPress.com un moyen sécurisé et convivial de s’authentifier auprès de votre application en utilisant leurs identifiants WordPress.com existants.

WordPress.com Connect permet aux utilisateurs et utilisatrices de WordPress.com de se connecter rapidement à votre service sans créer de nouveaux comptes. Lorsqu’une personne se connecte, votre application reçoit ses informations de profil de base (nom, e-mail, avatar) tandis qu’elle conserve le contrôle de ses données WordPress.com et de sa vie privée.

Caractéristiques clés de WordPress.com Connect :

• Convivial : Interface familière pour des millions d’utilisateurs et utilisatrices de WordPress.com
• Axé sur l’identité : Conçu pour l’authentification des utilisateurs, pas pour la gestion de contenu
• Portée limitée : Accès restreint aux informations de profil de base via le point de terminaison /me/
• Flux simplifié : Optimisé pour les boutons « Se connecter avec WordPress.com »

Avantages

Des millions d’utilisateurs – WordPress.com compte des millions d’utilisateurs et utilisatrices et ne cesse de croître chaque jour. En ajoutant WordPress.com Connect, vous rejoindrez une grande famille qui facilite l’exploration de nouveaux services pour les utilisateurs et utilisatrices de WordPress.com.

Compatible avec votre système de connexion existant – WordPress.com Connect peut être utilisé seul ou comme option de connexion complémentaire à votre système d’inscription existant. Une fois qu’une personne se connecte, vous aurez accès à ses informations de profil que vous pourrez utiliser dans votre propre application.

Relation de confiance – Permettez aux utilisateurs de se connecter avec les mêmes identifiants qu’ils utilisent au quotidien sur WordPress.com. Cela évite d’avoir à mémoriser et gérer de nouveaux identifiants de connexion pour un autre service.

Détails de l’implémentation OAuth2

WordPress.com Connect utilise le point de terminaison d’authentification OAuth2 (/oauth2/authenticate) plutôt que le point de terminaison d’autorisation standard. Ce point de terminaison spécialisé est optimisé pour la vérification d’identité et limite automatiquement la portée du jeton à l’accès Basic au profil.

Flux technique :

1. Autorisation de l’utilisateur : Redirection vers /oauth2/authenticate (et non /oauth2/authorize)
2. Échange de code : Échange du code d’autorisation via /oauth2/token (identique au flux OAuth2 complet)
3. Accès limité : Le jeton obtenu ne donne accès qu’au point de terminaison /me/
4. Données de profil : Récupération de l’identité de l’utilisateur via /rest/v1.1/me

Prérequis

Avant d’implémenter WordPress.com Connect, vous devez enregistrer votre application :

1. Créez une application WordPress.com sur developer.wordpress.com/apps
2. Configurez votre application : Utilisez le même titre que votre site web (affiché dans les formulaires de connexion)
3. Obtenez vos identifiants : Vous recevrez un CLIENT_ID et un CLIENT_SECRET
4. Définissez l’URI de redirection : Configurez l’URL vers laquelle les utilisateurs sont redirigés après l’authentification

Exemple d’implémentation (PHP)

Voici un exemple complet montrant comment implémenter WordPress.com Connect pour l’authentification des utilisateurs et la récupération de profil.

Configuration initiale

Commencez par configurer les identifiants de votre application. Remplacez ces valeurs par celles de votre application WordPress.com :

<?php
// config.php - WordPress.com Connect Configuration
define('CLIENT_ID', 'your_client_id');
define('CLIENT_SECRET', 'your_client_secret');
define('REDIRECT_URI', 'https://yourapp.com/auth-callback');

// WordPress.com OAuth2 endpoints (no changes needed)
define('AUTHENTICATE_URL', 'https://public-api.wordpress.com/oauth2/authenticate');
define('TOKEN_URL', 'https://public-api.wordpress.com/oauth2/token');
define('USER_INFO_URL', 'https://public-api.wordpress.com/rest/v1.1/me');

session_start(); // Required for state parameter security
?>

Étape 1 : Créer l’URL d’autorisation

Générez le bouton « Se connecter avec WordPress.com » qui redirige les utilisateurs vers WordPress.com pour l’authentification. Cela utilise le point de terminaison d’authentification (et non le point de terminaison d’autorisation standard).

Note de sécurité : le paramètre state prévient les attaques CSRF et doit être validé au retour des utilisateurs.

<?php
require_once 'config.php';

// Generate secure state parameter for CSRF protection
if (!isset($_SESSION['wpcc_state'])) {
    $_SESSION['wpcc_state'] = bin2hex(random_bytes(16)); // More secure than md5(mt_rand())
}

// Build authentication URL using /oauth2/authenticate endpoint
$auth_url = AUTHENTICATE_URL . '?' . http_build_query([
    'response_type' => 'code',
    'client_id'     => CLIENT_ID,
    'redirect_uri'  => REDIRECT_URI,
    'state'         => $_SESSION['wpcc_state'],
    'scope'         => 'auth' // Limited scope for profile access only
]);

// Display the Connect button
echo '<a href="' . htmlspecialchars($auth_url) . '">';
echo '<img src="https://s0.wp.com/i/wpcc-button.png?m=1391188133i" width="231" alt="Connect with WordPress.com" />';
echo '</a>';
?>

Cela génère le bouton familier de connexion à WordPress.com :

Étape 2 : Gérer la réponse d’autorisation

Lorsque les utilisateurs cliquent sur le bouton Se connecter, un écran d’autorisation WordPress.com s’affiche :

Après approbation, WordPress.com redirige les utilisateurs vers votre redirect_uri avec un code d’autorisation. Votre gestionnaire de rappel doit valider le paramètre state et échanger le code contre un jeton d’accès :

<?php
// auth-callback.php - Handle the authorization response
require_once 'config.php';

// Validate authorization response
if (!isset($_GET['code'])) {
    die('Error: No authorization code received. User may have declined access.');
}

if (!isset($_GET['state']) || $_GET['state'] !== $_SESSION['wpcc_state']) {
    die('Error: State mismatch. Possible CSRF attack detected.');
}

// Exchange authorization code for access token
$curl = curl_init(TOKEN_URL);
curl_setopt_array($curl, [
    CURLOPT_POST => true,
    CURLOPT_POSTFIELDS => [
        'client_id'     => CLIENT_ID,
        'client_secret' => CLIENT_SECRET,
        'code'          => $_GET['code'],
        'grant_type'    => 'authorization_code',
        'redirect_uri'  => REDIRECT_URI
    ],
    CURLOPT_RETURNTRANSFER => true,
    CURLOPT_SSL_VERIFYPEER => true
]);

$response = curl_exec($curl);
$http_code = curl_getinfo($curl, CURLINFO_HTTP_CODE);
curl_close($curl);

if ($http_code !== 200) {
    die('Error: Failed to obtain access token.');
}

$token_data = json_decode($response, true);
$access_token = $token_data['access_token'];

// Clean up session state
unset($_SESSION['wpcc_state']);
?>

Réponse de jeton réussie :

{
    "access_token": "your_access_token_here",
    "token_type": "bearer",
    "blog_id": 0,
    "blog_url": "https://public-api.wordpress.com",
    "scope": "auth"
}

Notez le scope: "auth" — cela confirme que le jeton dispose d’un accès limité à la vérification d’identité uniquement.

Étape 3 : Récupérer le profil utilisateur

Avec le jeton d’accès, récupérez les informations de profil de l’utilisateur depuis le point de terminaison /me/ :

<?php
// Fetch user profile using the access token
function get_user_profile($access_token) {
    $curl = curl_init(USER_INFO_URL);
    curl_setopt_array($curl, [
        CURLOPT_HTTPHEADER => [
            'Authorization: Bearer ' . $access_token
        ],
        CURLOPT_RETURNTRANSFER => true,
        CURLOPT_SSL_VERIFYPEER => true // Always verify SSL in production
    ]);

    $response = curl_exec($curl);
    $http_code = curl_getinfo($curl, CURLINFO_HTTP_CODE);
    curl_close($curl);

    if ($http_code !== 200) {
        throw new Exception('Failed to fetch user profile');
    }

    return json_decode($response, true);
}

// Get the user's WordPress.com profile
try {
    $user_profile = get_user_profile($access_token);

    // Store or process user information
    $user_id = $user_profile['ID'];
    $display_name = $user_profile['display_name'];
    $email = $user_profile['email'];
    $avatar_url = $user_profile['avatar_URL'];
    $is_verified = $user_profile['verified'];

} catch (Exception $e) {
    die('Error: ' . $e->getMessage());
}
?>

Format de la réponse du profil :

{
  "ID": 12345,
  "display_name": "Bob Smith",
  "username": "bobsmith",
  "email": "bob@example.com",
  "primary_blog": 67890,
  "avatar_URL": "https://gravatar.com/avatar/abc123?s=96",
  "profile_URL": "https://en.gravatar.com/bobsmith",
  "verified": true
}

Étape 4 : Finaliser l’authentification de l’utilisateur

Une fois le profil utilisateur obtenu, intégrez-le dans votre application :

<?php
// Complete user authentication flow
if ($is_verified) {
    // User has verified their email - safe to trust profile data
    $existing_user = find_user_by_wpcom_id($user_id);

    if ($existing_user) {
        // Log in existing user
        login_user($existing_user);
        redirect_to_dashboard();
    } else {
        // Create new account with WordPress.com profile data
        $new_user = create_user([
            'wpcom_id' => $user_id,
            'username' => $user_profile['username'],
            'email' => $email,
            'display_name' => $display_name,
            'avatar_url' => $avatar_url
        ]);
        login_user($new_user);
        redirect_to_welcome();
    }
} else {
    // Unverified email - handle with caution
    redirect_to_verification_required();
}
?>

Important : Vérifiez toujours le drapeau verified avant de faire confiance aux informations du profil. Les comptes non vérifiés peuvent contenir des données peu fiables.

WordPress.com Connect vs OAuth2 complet

Comprendre quand utiliser chaque approche :

Important : N’utilisez pas la même application WordPress.com à la fois pour l’authentification Connect et pour l’accès complet à l’API. Les jetons Connect sont limités au point de terminaison /me/ et ne peuvent pas accéder au contenu du blog ni aux fonctionnalités de gestion.