web-dev-qa-db-fra.com

idpiframe_initialization_failed dans Google Connectez-vous à partir de Localhost

J'essaie de créer un bouton de connexion Google en suivant ce lien. Jusqu'à présent, la boîte de dialogue de sélection de compte arrive, mais après cela, je ne vois aucun résultat dans la console. Au lieu de cela, je reçois cette erreur au chargement de la page,

"idpiframe_initialization_failed", details: "Not a valid Origin for the client: http://localhos…itelist this Origin for your project's client ID."
details: "Not a valid Origin for the client: http://localhost has not been whitelisted for client ID 386404527657-q4ss06np5g27dllq5ds7aif42udkh7e5.apps.googleusercontent.com. Please go to https://console.developers.google.com/ and whitelist this Origin for your project's client ID."

Voici les codes,

<html lang="en">
  <head>
    <meta name="google-signin-scope" content="profile email">
    <meta name="google-signin-client_id" content="YOUR_CLIENT_ID.apps.googleusercontent.com">
    <script src="https://apis.google.com/js/platform.js" async defer></script>
  </head>
  <body>
    <div class="g-signin2" data-onsuccess="onSignIn" data-theme="dark"</div>
    <script>
      function onSignIn(googleUser) {
        // Useful data for your client-side scripts:
        var profile = googleUser.getBasicProfile();
        console.log("ID: " + profile.getId()); // Don't send this directly to your server!
        console.log('Full Name: ' + profile.getName());
        console.log('Given Name: ' + profile.getGivenName());
        console.log('Family Name: ' + profile.getFamilyName());
        console.log("Image URL: " + profile.getImageUrl());
        console.log("Email: " + profile.getEmail());

        // The ID token you need to pass to your backend:
        var id_token = googleUser.getAuthResponse().id_token;
        console.log("ID Token: " + id_token);
      };
    </script>
  </body>
</html>

J'ai vraiment besoin de résoudre ce problème et d'obtenir les résultats dans ma console. Je ne sais pas quoi faire ensuite pour résoudre ce problème. Besoin d'aide à ce sujet, merci!

javascriptgoogle-apigoogle-oauthgoogle-signingoogle-plus-signin
12
Shihan Khan

J'avais ce problème exact et cette solution a fonctionné pour moi.

En bref: videz le cache de votre navigateur.

Dans Chrome: Paramètres → Avancé → Effacer les données de navigation → Images et fichiers mis en cache

30
Nathan Wailes

La solution qui a fonctionné pour moi a été de mettre l'origine en liste blanche dans l'API de la console développeur Google pour cette application.

3
Cliff Coulter

J'ai rencontré cette erreur sur plusieurs sites qui proposent la connexion à Google. J'ai dû "autoriser" le cookie accounts.google.com dans "afficher les cookies et autres données du site" pour que le site fonctionne (après avoir rechargé la page). Le blocage probable des cookies tiers dans le navigateur était la cause première de la première place,

0
gergelykocse