WordPress.com Connect

Este texto fue traducido usando IA. Si deseas ver el texto original en inglés, haz clic aquí.

WordPress.com Connect es una solución de autenticación simplificada diseñada específicamente para la funcionalidad de «Iniciar sesión con WordPress.com». Proporciona una forma segura y fácil de usar para que millones de usuarios de WordPress.com se autentiquen con tu aplicación utilizando sus credenciales existentes de WordPress.com.

WordPress.com Connect permite a los usuarios de WordPress.com iniciar sesión rápidamente en tu servicio sin crear cuentas nuevas. Cuando los usuarios se conectan, tu aplicación recibe su información básica de perfil (nombre, correo electrónico, avatar) mientras ellos mantienen el control sobre sus datos y privacidad en WordPress.com.

Características clave de WordPress.com Connect:

• Fácil de usar: Interfaz familiar para millones de usuarios de WordPress.com
• Enfocado en la identidad: Diseñado para la autenticación de usuarios, no para la gestión de contenido
• Alcance limitado: Acceso restringido a información básica del perfil a través del endpoint /me/
• Flujo simplificado: Optimizado para botones de «Iniciar sesión con WordPress.com»

Beneficios

Millones de usuarios – WordPress.com cuenta con millones de usuarios y crece cada día. Al añadir WordPress.com Connect, pasarás a formar parte de una gran familia que facilita a los usuarios de WordPress.com explorar nuevos servicios.

Compatible con tu sistema de inicio de sesión existente – WordPress.com Connect puede utilizarse de forma independiente o como una opción de inicio de sesión complementaria a tu sistema de registro existente. Una vez que un usuario se conecta, obtendrás acceso a su información de perfil, que podrás utilizar en tu propia aplicación.

Relación de confianza – Permite a los usuarios iniciar sesión con las mismas credenciales que utilizan a diario en WordPress.com. Esto elimina la molestia de tener que recordar y gestionar un nuevo inicio de sesión para otro servicio.

Detalles de implementación de OAuth2

WordPress.com Connect utiliza el endpoint de autenticación OAuth2 (/oauth2/authenticate) en lugar del endpoint de autorización estándar. Este endpoint especializado está optimizado para la verificación de identidad y limita automáticamente el alcance del token al acceso básico del perfil.

Flujo técnico:

1. Autorización del usuario: Redirige a /oauth2/authenticate (no a /oauth2/authorize)
2. Intercambio de código: Intercambia el código de autorización en /oauth2/token (igual que en OAuth2 completo)
3. Acceso limitado: El token resultante proporciona acceso únicamente al endpoint /me/
4. Datos del perfil: Recupera la identidad del usuario desde /rest/v1.1/me

Requisitos previos

Antes de implementar WordPress.com Connect, necesitas registrar tu aplicación:

1. Crea una aplicación de WordPress.com en developer.wordpress.com/apps
2. Configura tu aplicación: Usa el mismo título que tu sitio web (se muestra en los formularios de inicio de sesión)
3. Obtén las credenciales: Recibirás un CLIENT_ID y un CLIENT_SECRET
4. Establece la URI de redirección: Configura a dónde regresan los usuarios después de la autenticación

Ejemplo de implementación (PHP)

A continuación se muestra un ejemplo completo que demuestra cómo implementar WordPress.com Connect para la autenticación de usuarios y la obtención de perfiles.

Configuración inicial

Primero, configura las credenciales de tu aplicación. Reemplaza estos valores con los de tu aplicación de 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
?>

Paso 1: Crear la URL de autorización

Genera el botón «Conectar con WordPress.com» que redirige a los usuarios a WordPress.com para la autenticación. Esto utiliza el endpoint de autenticación (no el endpoint de autorización estándar).

Nota de seguridad: El parámetro state previene ataques CSRF y debe validarse cuando los usuarios regresan.

<?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>';
?>

Esto genera el conocido botón de Conectar con WordPress.com:

Paso 2: Gestionar la respuesta de autorización

Cuando los usuarios hacen clic en el botón Conectar, ven una pantalla de autorización de WordPress.com:

Tras la aprobación, WordPress.com redirige a los usuarios de vuelta a tu redirect_uri con un código de autorización. Tu controlador de callback debe validar el parámetro state e intercambiar el código por un token de acceso:

<?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']);
?>

Respuesta exitosa del token:

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

Observa el scope: "auth": esto confirma que el token tiene acceso limitado únicamente para la verificación de identidad.

Paso 3: Obtener el perfil del usuario

Con el token de acceso, obtén la información del perfil del usuario desde el endpoint /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());
}
?>

Formato de la respuesta del perfil:

{
  "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
}

Paso 4: Completar la autenticación del usuario

Una vez que tengas el perfil del usuario, intégralo en tu aplicación:

<?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();
}
?>

Importante: Comprueba siempre el indicador verified antes de confiar en la información del perfil. Las cuentas no verificadas pueden contener datos poco fiables.

WordPress.com Connect vs OAuth2 completo

Cuándo utilizar cada enfoque:

Importante: No utilices la misma aplicación de WordPress.com tanto para la autenticación con Connect como para el acceso completo a la API. Los tokens de Connect están limitados al endpoint /me/ y no pueden acceder al contenido del blog ni a las funciones de gestión.