Nous désistait de JavaScript de connexion Google Platform Library pour le Web . Pour la connexion à l' authentification et l' utilisateur, utilisez le nouveau Google Identity Services SDKs pour les Web et Android à la place.

Intégration de Google Sign-In dans votre application Web

Google Sign-In gère le flux OAuth 2.0 et le cycle de vie des jetons, ce qui simplifie votre intégration avec les API Google. Un utilisateur a toujours la possibilité de révoquer l'accès à une application à tout moment.

Ce document décrit comment effectuer une intégration de base de Google Sign-In.

Créer des informations d'identification d'autorisation

Toute application qui utilise OAuth 2.0 pour accéder aux API Google doit disposer d'informations d'identification d'autorisation qui identifient l'application sur le serveur OAuth 2.0 de Google. Les étapes suivantes expliquent comment créer des informations d'identification pour votre projet. Vos applications peuvent ensuite utiliser les informations d'identification pour accéder aux API que vous avez activées pour ce projet.

  1. Go to the Credentials page.
  2. Cliquez sur Créer des informations d'identification> ID client OAuth .
  3. Sélectionnez le type d'application d' application Web .
  4. Nommez votre client OAuth 2.0 et cliquez sur Créer

Une fois la configuration terminée, notez l'ID client qui a été créé. Vous aurez besoin de l'ID client pour effectuer les étapes suivantes. (Un secret client est également créé, mais vous n'en avez besoin que pour les opérations côté serveur.)

Chargez la bibliothèque de la plate-forme Google

Vous devez inclure la bibliothèque de la plate-forme Google sur vos pages Web qui intègrent la connexion à Google.

<script src="https://apis.google.com/js/platform.js" async defer></script>

Spécifiez l'ID client de votre application

Spécifiez l'ID client que vous avez créé pour votre application dans la Google Developers Console avec l'élément méta google-signin-client_id .

<meta name="google-signin-client_id" content="YOUR_CLIENT_ID.apps.googleusercontent.com">

Ajouter un bouton de connexion Google

Le moyen le plus simple d'ajouter un bouton de connexion Google à votre site consiste à utiliser un bouton de connexion rendu automatiquement. Avec seulement quelques lignes de code, vous pouvez ajouter un bouton qui se configure automatiquement pour avoir le texte, le logo et les couleurs appropriés pour l'état de connexion de l'utilisateur et les étendues que vous demandez.

Pour créer un bouton de connexion Google qui utilise les paramètres par défaut, ajoutez un élément div avec la classe g-signin2 à votre page de connexion:

<div class="g-signin2" data-onsuccess="onSignIn"></div>

Voici un exemple du bouton de connexion Google par défaut:

Obtenir des informations de profil

Une fois que vous avez connecté un utilisateur avec Google à l'aide des champs d'application par défaut, vous pouvez accéder à l'identifiant Google, au nom, à l'URL de profil et à l'adresse e-mail de l'utilisateur.

Pour récupérer les informations de profil d'un utilisateur, utilisez la méthode getBasicProfile() .

function onSignIn(googleUser) {
  var profile = googleUser.getBasicProfile();
  console.log('ID: ' + profile.getId()); // Do not send to your backend! Use an ID token instead.
  console.log('Name: ' + profile.getName());
  console.log('Image URL: ' + profile.getImageUrl());
  console.log('Email: ' + profile.getEmail()); // This is null if the 'email' scope is not present.
}

Déconnecter un utilisateur

Vous pouvez permettre aux utilisateurs de se déconnecter de votre application sans se déconnecter de Google en ajoutant un bouton de déconnexion ou un lien vers votre site. Pour créer un lien de GoogleAuth.signOut() une fonction qui appelle la méthode GoogleAuth.signOut() à l'événement onclick du lien.

<a href="#" onclick="signOut();">Sign out</a>
<script>
  function signOut() {
    var auth2 = gapi.auth2.getAuthInstance();
    auth2.signOut().then(function () {
      console.log('User signed out.');
    });
  }
</script>