L’authentification des utilisateurs est l’une des parties les plus importantes de la création d’une application, et presque toutes les applications comportent une sorte d’authentification. Cependant, il devient rapidement difficile de gérer l’authentification lorsque vous avez plusieurs applications liées mais indépendantes à maintenir.
Supposons que vous construisez une application de partage de photos qui permet à un utilisateur de s’inscrire avec un nom d’utilisateur et un mot de passe pour partager ses photos. Votre équipe pourrait décider plus tard de créer un forum avec WordPress pour aider à répondre aux questions de vos utilisateurs, mais ce nouveau projet n’est pas lié à votre application d’origine. Il utilise une pile technologique, une base de données et une configuration d’hébergement entièrement différentes.
Cela signifie que vos utilisateurs doivent s’inscrire encore sur ce deuxième site Web et mémorisez un autre ensemble de noms d’utilisateur et de mots de passe. Donner aux utilisateurs deux ensembles d’informations d’identification entièrement différents n’est pas idéal, c’est donc là que l’authentification unique entre en jeu.
L’authentification unique, communément appelée SSO, est un mécanisme d’authentification qui permet aux utilisateurs d’utiliser un seul ensemble d’informations d’identification pour se connecter à plusieurs applications ou sites Web différents. Dans une configuration SSO typique, vous avez un fournisseur de services (l’application à laquelle l’utilisateur essaie de se connecter) et un fournisseur d’identité comme FusionAuth, qui gère l’authentification. Cela signifie que vos utilisateurs n’ont besoin que d’un seul ensemble d’informations d’identification pour se connecter à toutes vos applications.
Utilisation de FusionAuth pour l’authentification unique
Pour utiliser SSO, vous devez choisir un fournisseur d’identité qui gérera l’authentification pour vous. FusionAuth est l’un de ces fournisseurs d’identité. FusionAuth fournit des bibliothèques pour la plupart des principaux langages et frameworks de programmation, notamment PHP, Ruby, Python, Java, Go et .NET.
FusionAuth est entièrement personnalisable et est disponible en tant que package autonome pour Linux, Mac et Windows, vous pouvez donc auto-héberger FusionAuth sur n’importe quel serveur. Vous pouvez même commencer gratuitement, il n’est donc pas nécessaire de saisir votre numéro de carte de crédit pour suivre ce didacticiel.
Si vous créez un site Web avec WordPress et que vous devez intégrer la gestion des utilisateurs, vous pouvez tirer parti du SSO. Il offre une solution plus flexible aux utilisateurs et leur évite de gérer plusieurs informations d’identification. En reprenant l’exemple ci-dessus, avec SSO, un utilisateur peut se connecter à l’application de partage de photos et à l’application de forum avec le même nom d’utilisateur et le même mot de passe.
Dans ce didacticiel, vous apprendrez à configurer l’authentification unique dans WordPress à l’aide de FusionAuth à l’aide d’un Module WordPress OpenID Connect.
Conditions préalables
Pour intégrer FusionAuth à WordPress, vous avez besoin de deux choses : une instance WordPress avec des autorisations d’administrateur et un compte FusionAuth. Si vous souhaitez exécuter FusionAuth vous-même, vous pouvez téléchargez-le gratuitement.
Si vous souhaitez suivre ce didacticiel et que vous ne voulez pas vous soucier du lancement d’une instance WordPress ou d’une instance FusionAuth, vous pouvez utiliser le Script Docker Compose ici pour configurer rapidement une instance WordPress et FusionAuth. Si vous avez déjà une instance WordPress et un compte FusionAuth, vous pouvez passer à Ajouter FusionAuth à WordPress.
Avant de commencer, assurez-vous que Docker est installé et exécuté sur votre ordinateur et que Docker Compose est installé. Vous pouvez trouver les guides d’installation de Docker ici et les guides pour Docker Compose ici.
Configuration de WordPress et FusionAuth
Une fois que vous avez Docker en cours d’exécution et un compte FusionAuth, exécutez les commandes suivantes dans votre terminal :
git clone https://github.com/FusionAuth/fusionauth-example-wordpress-sso.git
cd fusionauth-example-wordpress-sso
docker-compose up -d
Cela démarrera une instance WordPress sur le port 8030 et une instance FusionAuth sur le port 9011. Maintenant, terminez l’installation de WordPress en ouvrant une fenêtre de navigateur et en accédant à localhost:8030.
Vous devriez être accueilli par cet écran :
Choisissez votre langue préférée et cliquez sur “Continuer”.
Sur la page suivante, entrez le titre du site et créez un compte administrateur en fournissant un nom d’utilisateur, une adresse e-mail et un mot de passe.
Appuyez sur “Installer WordPress” pour terminer l’installation. Connectez-vous avec votre nouveau nom d’utilisateur et votre nouveau mot de passe lorsque vous avez terminé.
Configuration de FusionAuth
Configurons maintenant FusionAuth. Aller vers localhost:9011. Vous verrez l’écran de configuration de FusionAuth.
Saisissez votre nom, prénom, email et mot de passe. Une fois terminé, cliquez sur “Soumettre” pour terminer l’installation.
Ajout de FusionAuth SSO à WordPress
Une fois FusionAuth et WordPress installés, vous pouvez continuer à ajouter FusionAuth SSO à votre instance WordPress. Dans cette section, vous allez installer un plug-in d’authentification unique OAuth et le configurer pour communiquer avec votre instance FusionAuth locale.
Installation du plugin
Pour ce tutoriel, vous utiliserez le Plugin générique OpenID Connect.
Accédez à votre tableau de bord d’administration WordPress à localhost:8030/wp-admin et cliquez sur la page “Plugins” dans la barre latérale. Cliquez sur le bouton “Ajouter un nouveau” et, sur la page suivante, recherchez “OpenID Connect Generic”.
Le plugin doit être le premier dans les résultats de la recherche. Tu veux celui de daggerhart. Installez et activez le plugin.
Une fois le plugin activé, choisissez “Paramètres” puis “Client OpenID Connect” dans le menu de gauche. C’est ici que vous pourrez configurer le plugin pour qu’il fonctionne avec FusionAuth.
Mais d’abord, configurons FusionAuth. Après cela, vous reviendrez pour terminer la configuration de ce plugin WordPress.
Configuration de FusionAuth
Pour démarrer avec SSO, vous devez créer une application dans FusionAuth. Une application représente la ressource où les utilisateurs se connecteront, dans votre cas, au site WordPress. Chaque site Web, application mobile ou toute autre application doit être créé en tant qu’application dans FusionAuth. Les utilisateurs peuvent utiliser le même nom d’utilisateur et mot de passe pour se connecter à toutes ces applications gérées par FusionAuth.
Nous n’allons pas créer une application de partage de photos dans ce tutoriel ; cela vous est laissé en exercice, cher lecteur. Supposons que vous ayez une application de partage de photos existante et que vous souhaitiez ajouter SSO dans une application WordPress, comme le forum mentionné ci-dessus.
Cliquez sur le menu “Applications” dans la barre latérale, puis sur le bouton vert plus (“+”) dans le coin supérieur droit.
Dans l’écran “Ajouter une application”, indiquez un nom pour votre application. Ceci est juste à des fins d’affichage afin que vous puissiez distinguer vos applications.
Maintenant, cliquez sur l’onglet OAuth. Les paramètres par défaut devraient suffire. La seule chose que vous devez fournir est la valeur “URL de redirection autorisées”. Il s’agit des URL vers lesquelles les utilisateurs seront redirigés après s’être authentifiés. Dans ce cas, les deux URL sont fournies et gérées par le plugin. Saisissez ces deux URL :
http://localhost:8030/wp-admin/admin-ajax.php?action=openid-connect-authorize. Il s’agit de l’URL vers laquelle FusionAuth redirigera une fois que l’utilisateur s’est connecté.http://localhost:8030/wp-login.php?loggedout=true&wp_lang=en_USIl s’agit de l’URL vers laquelle FusionAuth redirigera après la déconnexion de l’utilisateur.
Ton wp_lang la valeur peut varier si vous utilisez des paramètres régionaux différents.
Une fois que vous avez mis cette application en production, assurez-vous de mettre à jour les URL de redirection autorisées avec les vrais noms d’hôte. Si votre site WordPress vit à forum.photosharing.comles URL seraient :
https://forum.photosharing.com/wp-admin/admin-ajax.php?action=openid-connect-authorize. Il s’agit de l’URL vers laquelle FusionAuth redirigera une fois que l’utilisateur s’est connecté.https://forum.photosharing.com/wp-login.php?loggedout=true&wp_lang=en_USIl s’agit de l’URL vers laquelle FusionAuth redirigera après la déconnexion de l’utilisateur.
Voici à quoi devrait ressembler l’onglet “OAuth” une fois que vous avez terminé :
Par défaut, FusionAuth fournit une fonctionnalité de connexion. Vous devrez créer manuellement de nouveaux utilisateurs via le panneau d’administration ou via l’API. Ceci est utile si vous créez un site interne où vous ne souhaitez pas que les utilisateurs s’enregistrent eux-mêmes, mais dans ce didacticiel, les utilisateurs doivent pouvoir créer un compte.
Pour activer l’enregistrement des utilisateurs, cliquez sur l’onglet “Enregistrement” et activez “Enregistrement en libre-service”. Gardez les paramètres par défaut inchangés.
Lorsque vous avez terminé, cliquez sur le bouton bleu d’enregistrement dans le coin supérieur droit :
Vous serez maintenant présenté avec une liste de vos applications. Cliquez sur le bouton de visualisation (le miroir vert) à côté de l’application que vous venez de créer :
Une fenêtre contextuelle s’ouvrira avec les détails de votre application.
Recherchez la section “Configuration OAuth”. Vous devrez peut-être faire défiler un peu:
Gardez cette fenêtre ouverte car vous devrez faire un peu de copier-coller à partir d’ici à l’étape suivante.
Configuration du plug-in
Revenez à votre tableau de bord d’administration WordPress où vous aviez stocké les informations du plugin WordPress.
Vous devriez voir cet écran de configuration :
Revenez à l’écran FusionAuth et copiez le “Client Id” et le “Client Secret” de la fenêtre contextuelle (vous devrez peut-être faire défiler un peu).
Maintenant, revenez à l’écran de configuration du plugin WordPress et commencez à saisir des valeurs.
- Collez les valeurs des champs “Client Id” et “Client Secret” dans le formulaire de configuration.
- Mettre
openiddans le champ “Portée OpenID”. - Dans le champ « Login Endpoint URL », saisissez
<your-fusionauth-domain>/oauth2/authorize. Dans notre cas, ce serahttp://localhost:9011/oauth2/authorize. - Dans le champ “Userinfo Endpoint URL”, saisissez
<your-fusionauth-domain>/oauth2/userinfo. Cependant, comme nous fonctionnons dans un conteneur Docker, WordPress ne peut pas atteindre FusionAuth vialocalhostl’URL doit donc êtrehttp://fusionauth:9011/oauth2/userinfo. Docker s’occupe de la résolution DNS locale. - Dans le champ “Token Validation Endpoint URL”, mettez
<your-fusionauth-domain>/oauth2/token. Dans notre cas, il faudraithttp://localhost:9011/oauth2/token. Dans notre cas, pour la même raison, ce serahttp://fusionauth:9011/oauth2/token. - Dans le champ « End Session Endpoint URL », saisissez
<your-fusionauth-domain>/oauth2/logout. Dans notre cas, ce serahttp://localhost:9011/oauth2/logout. - Cochez “Désactiver la vérification SSL” car aucune de nos instances Docker n’exécute HTTPS.
- Remplacez les valeurs “Clé d’identité” et “Clé de surnom” par
sub. C’est ce que WordPress utilisera comme ID en interne. - Changez le “Formatage du nom d’affichage” en
{email}. C’est ce qui sera affiché à l’utilisateur dans l’écran d’administration de WordPress. - Cochez “Lier les utilisateurs existants” si les utilisateurs de votre base de données WordPress locale ont les mêmes e-mails que les utilisateurs de votre base de données FusionAuth ; sinon, vous verrez une erreur lorsque ces utilisateurs essaieront de se connecter.
Notez que le “Authorize Endpoint” n’a pas besoin d’être modifié car il sera ouvert dans le navigateur. Comme mentionné ci-dessus, pour les URL telles que “Token Validation Endpoint URL”, si vous utilisez Docker, vous devrez utiliser un nom d’hôte résoluble Docker comme fusionauth. Si vous n’utilisez pas Docker, vous devez conserver toutes les URL pointées vers localhost.
Cliquez enfin sur le bouton “Enregistrer les modifications”. Voici à quoi ressemblera un formulaire rempli une fois que vous l’aurez rempli :
Essai
Pour tester l’ensemble du flux de connexion, déconnectez-vous du tableau de bord WordPress ou utilisez une fenêtre de navigation privée. Accédez à la page de connexion WordPress : http://localhost:8030/wp-login.php. Vous devriez voir un bouton “Connexion avec OpenID Connect” au-dessus des champs de connexion habituels.
En cliquant sur ce bouton, vous accéderez à la page de connexion FusionAuth. Vous pouvez vous connecter avec vos informations d’identification FusionAuth, par exemple l’utilisateur que vous avez créé en premier.
Vous pouvez également cliquer sur le lien “Créer un compte” et enregistrer un nouvel utilisateur.
Une fois authentifié avec succès, vous serez redirigé vers la page d’accueil d’administration du site WordPress.
Toutes les pages utilisateur de FusionAuth peuvent être thématisées pour ressembler aux autres pages de l’application. En savoir plus ici.
Vous pouvez confirmer qu’il s’agit bien de l’utilisateur avec lequel vous vous êtes connecté en regardant le nom d’affichage, qui devrait être l’e-mail de votre utilisateur FusionAuth.
Félicitations, vous avez réussi à implémenter SSO avec FusionAuth sur votre site WordPress. Les utilisateurs peuvent s’inscrire et se connecter avec succès.
Conclusion
Dans ce didacticiel, vous avez appris comment SSO peut faciliter la vie de vos utilisateurs WordPress en leur permettant d’utiliser un seul ensemble d’informations d’identification pour se connecter à toutes vos applications. Vous avez appris comment FusionAuth peut servir de fournisseur d’identité et comment l’intégrer à WordPress en tirant parti d’un plugin SSO.
*** Ceci est un blog syndiqué du Security Bloggers Network de Le blog FusionAuth Rédigé par Le blog FusionAuth. Lire le message d’origine sur : https://fusionauth.io/blog/2021/12/06/how-to-set-up-single-sign-on-between-fusionauth-wordpress
Jeu de briques
Snake
Pacman
Bubble