Intégration avec WordPress

Ce guide vous expliquera comment intégrer Logto avec WordPress en utilisant le plugin OIDC. Mais d'abord, jetons un coup d'œil à l'expérience utilisateur une fois l'intégration terminée.

Le processus de connexion avec l'intégration Logto#

1. L'utilisateur accède à la page de connexion du site WordPress, qui est [URL DU SITE]/wp-login.php par défaut, et il y a un bouton de connexion par OIDC.
2. L'utilisateur clique sur le bouton, et est redirigé vers la page de connexion de Logto avec votre expérience de connexion personnalisée.
3. L'utilisateur choisit une méthode de connexion, et Logto authentifiera l'utilisateur.
4. Une fois l'utilisateur authentifié, Logto le redirigera vers le site WordPress.
5. WordPress créera un nouveau compte utilisateur ou connectera le compte utilisateur existant, et redirigera l'utilisateur vers la page précédente.

Maintenant que nous avons vu le résultat final de l'intégration de Logto avec WordPress, retroussons nos manches et plongeons dans le processus d'intégration.

Prérequis#

Avant de commencer, assurez-vous d'avoir les éléments suivants :

1. Un site WordPress : Un site WordPress entièrement opérationnel est requis. Assurez-vous d'avoir accès à l'administration pour gérer les plugins et configurer les paramètres.
2. Une instance Logto : Créez une nouvelle instance Logto en visitant le Logto Console, ou hébergez votre propre instance en suivant le guide d'installation.

Étapes d'intégration#

Étape 1 : Créer une application Logto#

1. Visitez le Logto Console.
2. Allez à "Applications" et cliquez sur "Créer une application".
3. Cliquez sur "Créer une application sans framework".
4. Sélectionnez "Web traditionnel" comme type d'application.
5. Nommez votre application et cliquez sur "Créer une application".

Étape 2 : Installer le plugin#

1. Connectez-vous à votre site WordPress.
2. Rendez-vous dans "Extensions" et cliquez sur "Ajouter".
3. Recherchez "OpenID Connect Generic" et installez le plugin de daggerhart.
4. Activez le plugin.

Étape 3 : Configurer le plugin#

1. Ouvrez les paramètres du plugin en allant dans "Réglages" > "OpenID Connect Generic".
2. Remplissez les champs suivants :
   • Client ID : L'ID de l'application Logto.
   • Client Secret : Le secret de l'application Logto.
   • OpenID Scope : Entrez email profile openid offline_access.
   • Login Endpoint URL : L'URL du point de terminaison d'autorisation de votre application Logto, qui est https://[tenant-id].logto.app/oidc/auth, vous pouvez cliquer sur "afficher les détails du point de terminaison" sur la page de l'application Logto pour obtenir l'URL.
   • Userinfo Endpoint URL : L'URL du point de terminaison userinfo de votre application Logto, qui est https://[tenant-id].logto.app/oidc/me.
   • Token Validation Endpoint URL : L'URL du point de terminaison de validation du token de votre application Logto, qui est https://[tenant-id].logto.app/oidc/token.
   • End Session Endpoint URL : L'URL du point de terminaison de fin de session de votre application Logto, qui est https://[tenant-id].logto.app/oidc/session/end.
   • Identity Key : La clé unique dans le token ID qui contient l'identité de l'utilisateur, cela peut être email ou sub, en fonction de votre configuration.
   • Nickname Key : La clé dans le token ID qui contient le pseudo de l'utilisateur, vous pouvez la définir sur sub et la modifier plus tard.

Étape 4 : Configurer l'application#

1. Dans les paramètres du plugin, faites défiler jusqu'à la section "Notes", et copiez la valeur "Redirect URI".
2. Dans le Logto Console, allez dans les paramètres de votre application.
3. Ajoutez la valeur "Redirect URI" copiée dans le champ "Redirect URIs".

Étape 5 : Tester l'intégration#

1. Déconnectez-vous de votre site WordPress.
2. Visitez la page de connexion WordPress et cliquez sur le bouton "Se connecter avec Logto".
3. Vous serez redirigé vers la page de connexion Logto.
4. Connectez-vous avec votre compte Logto.
5. Vous serez redirigé vers le site WordPress et connecté automatiquement.

Étapes finales#

Félicitations ! Vous avez intégré avec succès Logto avec WordPress.

Pour personnaliser davantage l'intégration, vous pouvez explorer les fonctionnalités supplémentaires dans la page de paramètres du plugin, comme le lien des utilisateurs existants, la personnalisation du bouton de connexion, l'utilisation du mode SSO, et plus encore.