Partage via

Configuration de la connexion externe Google dans ASP.NET Core

  • Article

Par Valeriy Novytskyy, Rick Anderson et Sharaf Abacery

Ce tutoriel vous montre comment permettre aux utilisateurs de se connecter avec leur compte Google à l’aide du projet ASP.NET Core créé sur la page précédente.

Créer l’ID client et le secret Google OAuth 2.0

  • Suivez les instructions de Intégrer Google Sign-In dans votre application web (documentation Google)

  • Accédez à Google API & Services.

  • Un Project doit d'abord exister, vous devrez peut-être en créer un. Une fois qu’un projet est sélectionné, accédez au tableau de bord .

  • Dans l’écran de consentement Oauth du tableau de bord :

    • Sélectionnez Type d’utilisateur - Externe et CRÉER.
    • Dans la boîte de dialogue d'informations de l'application , fournissez un nom d'application pour l'application, l'e-mail de support utilisateur et les informations de contact du développeur .
    • Suivez pas à pas l’étape Portées.
    • Suivez pas à pas l’étape Utilisateurs de test.
    • Passez en revue l’écran de consentement OAuth et revenez à l’application Tableau de bord.

  • Sous l’onglet informations d’identification du tableau de bord de l’application, sélectionnez CREATE CREDENTIALS>ID client OAuth.

  • Sélectionnez Type d’application>Application Web, choisissez un nom.

  • Dans la section URI de redirection autorisées, sélectionnez AJOUTER URI pour définir l'URI de redirection. Exemple d’URI de redirection : https://localhost:{PORT}/signin-google, où l’espace réservé {PORT} est le port de l’application.

  • Cliquez sur le bouton CRÉER.

  • Enregistrez l'ID client et le secret client et pour la configuration de l'application.

  • Lors du déploiement du site, choisissez l'une des options suivantes :

    • Mettez à jour l’URI de redirection de l’application dans la console Google vers l’URI de redirection déployée de l’application.
    • Créez une inscription d’API Google dans la console Google pour l’application de production avec son URI de redirection de production.

Stocker l’ID client et le secret Google

Stockez des paramètres sensibles, tels que l’ID client Google et les valeurs de secret avec Secret Manager. Pour cet exemple, procédez comme suit :

  1. Initialisez le projet pour le stockage secret conformément aux instructions de Activer le stockage secret.

  2. Stockez les paramètres sensibles dans le magasin de secrets local avec les clés secrètes Authentication:Google:ClientId et Authentication:Google:ClientSecret:

    dotnet user-secrets set "Authentication:Google:ClientId" "<client-id>"
dotnet user-secrets set "Authentication:Google:ClientSecret" "<client-secret>"

Le séparateur : ne fonctionne pas avec des clés hiérarchiques de variable d’environnement sur toutes les plateformes. Par exemple, le séparateur : n’est pas pris en charge par Bash. Le trait de soulignement double, __, est :

  • Pris en charge par toutes les plateformes.
  • Remplacé automatiquement par deux points, :.

Vous pouvez gérer vos informations d’identification et votre utilisation de l’API dans la console API .

Configurer l’authentification Google

L’appel à AddIdentity configure les paramètres de schéma par défaut. La surcharge AddAuthentication(IServiceCollection, String) définit la propriété DefaultScheme. La surcharge AddAuthentication(IServiceCollection, Action<AuthenticationOptions>) permet de configurer des options d’authentification, qui peuvent être utilisées pour configurer des schémas d’authentification par défaut à des fins différentes. Les appels suivants à AddAuthentication remplacent les propriétés AuthenticationOptions précédemment configurées.

AuthenticationBuilder méthodes d’extension qui inscrivent un gestionnaire d’authentification ne peuvent être appelées qu’une seule fois par schéma d’authentification. Il existe des surcharges qui permettent de configurer les propriétés du schéma, le nom du schéma et le nom d’affichage.

Se connecter avec Google

  • Obtenez un lien vers la bibliothèque à lien de bibliothèque développeur Google pour obtenir un lien vers la bibliothèque.
  • Accédez ensuite à la génération du bouton développeur Google
  • Configurez votre contrôleur pour qu’il corresponde à data-login_uri="{HostName}/{ControllerName}/{actionName}" attrbute, car une fois la connexion réussie, elle vous transférera vers ce lien.
  • Créez un contrôleur et une action qui prend un argument string credential, qui est retourné par Google lors de la fin du processus de connexion.
  • Vérifiez la credential à l’aide de la ligne de code suivante : GoogleJsonWebSignature.Payload payload = await GoogleJsonWebSignature.ValidateAsync(credential);
  • Cette opération récupère les informations disponibles sur l’utilisateur connecté, qui peut ensuite être stockée dans une base de données.

Modifier l’URI de rappel par défaut

Le segment d’URI /signin-google est défini comme rappel par défaut du fournisseur d’authentification Google. Vous pouvez modifier l’URI de rappel par défaut lors de la configuration du middleware d’authentification Google via la propriété RemoteAuthenticationOptions.CallbackPath héritée de la classe GoogleOptions.

Dépannage

  • Si la connexion ne fonctionne pas et que vous ne recevez pas d’erreurs, passez au mode de développement pour faciliter le débogage du problème.
  • Si Identity n’est pas configuré en appelant services.AddIdentity dans ConfigureServices, la tentative d’authentification se traduit par ArgumentException : l’option « SignInScheme » doit être fournie. Le modèle de projet utilisé dans ce didacticiel garantit que Identity est configuré.
  • Si la base de données de site n’a pas été créée en appliquant la migration initiale, vous obtenez Une opération de base de données a échoué lors du traitement de la demande erreur. Sélectionnez Appliquer les migrations pour créer la base de données, puis actualisez la page pour passer outre l'erreur.
  • Erreur HTTP 500 après l'authentification réussie de la requête par le fournisseur OAuth 2.0 tel que Google : consultez le problème GitHub .
  • Comment implémenter l’authentification externe avec Google pour React et d’autres applications SPA : consultez ce problème GitHub.

Étapes suivantes

  • Cet article a montré comment vous pouvez vous authentifier auprès de Google. Vous pouvez suivre une approche similaire pour vous authentifier auprès d’autres fournisseurs répertoriés sur la page précédente.
  • Une fois que vous avez publié l’application sur Azure, réinitialisez l'ClientSecret dans la console d’API Google.
  • Définissez les Authentication:Google:ClientId et les Authentication:Google:ClientSecret en tant que paramètres d’application dans le portail Azure. Le système de configuration est configuré pour lire des clés à partir de variables d’environnement.