wake-up-neo.net

Wie implementiere ich das Anmelden bei Google auf meiner Website?

Auf meiner Website möchte ich Nutzern erlauben, sich mit einem Google-Konto anzumelden. Ich habe vor, openid zu verwenden, möchte jedoch die Anmeldung bei Google zulassen, da dies mehr Vorteile bietet. Ich habe in der Vergangenheit einige Websites bemerkt, die sich mit einem Google-Konto (Google Mail) und IIRC anmelden können, obwohl sie openID NICHT unterstützen (aber ich könnte mich irren).

Wie implementiere ich "Mit Google anmelden"?

logingmailcross-domainopenidgoogle-oauth
57
user34537

Wenn Sie OpenID verwenden möchten, verwenden Sie diese. Google ist bereits ein OpenID 2.0-Anbieter.

Der OpenID-Anbieter von Google befindet sich unter: https://www.google.com/accounts/o8/ud

(HINWEIS: Es hat keinen Sinn, diese URI in Ihrem Browser zu besuchen, sie funktioniert jedoch für OpenID.)

Dies wird hauptsächlich auf der Seite Accounts API behandelt, auf der auch OAuth und die hybriden und proprietären Anmeldesysteme behandelt werden. Abhängig von Ihrer Site möchten Sie möglicherweise auch - verwenden. Friend Connect , ein OpenSocial-Container, der intern OpenID zur Authentifizierung verwendet.

Ich bin natürlich voreingenommen gegenüber Friend Connect, da ich der DPE für dieses Projekt bin, aber Sie werden wahrscheinlich besser direkt mit dem OpenID-Anbieter bedient, wenn Sie nicht auch Dinge tun, die einen sozialen Graphen beinhalten.

Bearbeiten für 2012: Sie möchten OAuth 2.0 für die Anmeldung verwenden. GFC wird heruntergefahren .

31
Bob Aman

Sie könnten interessiert sein an RPX , einer All-in-One-Lösung, mit der Benutzer auswählen können, welchen Identitätsanbieter sie für die Anmeldung bei Ihrer Website verwenden möchten . Nicht nur Google und OpenID werden unterstützt, sondern auch viele andere.

RPX kümmert sich um alle Details der Schnittstellen zu den einzelnen Identitätsanbietern und stellt Ihnen eine gemeinsame API zur Verfügung, mit der Sie arbeiten können.

16
Greg Hewgill

Integration von Google Sign-In in Ihre Web-App

Erstellen Sie ein Google Developers Console-Projekt und eine Client-ID.

Laden Sie die Google Platform Library

Sie müssen die Google Platform Library in Ihre Webseiten aufnehmen, auf denen Google Sign-In integriert ist.

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

Geben Sie die Client-ID Ihrer App an

Geben Sie die Client-ID, die Sie für Ihre App in der Google Developers Console erstellt haben, mit dem Metaelement google-signin-client_id an.

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

Hinweis: Sie können die Client-ID Ihrer App auch mit dem Parameter client_id der Methode gapi.auth2.init () angeben.

Fügen Sie eine Google-Anmeldeschaltfläche hinzu

Der einfachste Weg, Ihrer Website eine Google-Anmeldeschaltfläche hinzuzufügen, ist die Verwendung einer automatisch gerenderten Anmeldeschaltfläche. Mit nur wenigen Codezeilen können Sie eine Schaltfläche hinzufügen, die sich automatisch so konfiguriert, dass Text, Logo und Farben dem Anmeldestatus des Benutzers und den von Ihnen angeforderten Bereichen entsprechen.

Fügen Sie Ihrer Anmeldeseite ein div-Element mit der Klasse g-signin2 hinzu, um eine Google-Anmeldeschaltfläche zu erstellen, die die Standardeinstellungen verwendet:

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

Andere Info. könnte gefunden werden hier

Andere mögliche Lösung ist

Verwenden von OAuth 2.0 für den Zugriff auf Google-APIs

Auth Protocols

Überblick über OAuth 2.0

OpenID Connect

OAuth 2.0 für serverseitige Web-Apps

OAuth 2.0 für JavaScript Web Apps

OAuth 2.0 für mobile und Desktop-Apps

4
KhogaEslam

Ich glaube, Sie suchen nach dem Google Accounts API .

1
Pablo

Ich denke, was Sie wollen, ist Google Friend Connect

edit: Nein, du tust es nicht mehr, da es veraltet ist.

1
DanSingerman

ich möchte jedoch die Anmeldung bei Google zulassen

Fügen Sie in diesem Fall den folgenden Code hinzu

[~ # ~] html [~ # ~] 

 <div id="mySignin" onclick="login()"><img src="google_image_here.png" alt="google" style="cursor:pointer;height: 60px;width: 309px;"/></div>

[~ # ~] js [~ # ~] 

        <script type="text/javascript">
        function login() 
        {
          var myParams = {
            'clientid' : 'YOUR_CLIENT_ID.apps.googleusercontent.com',
            'cookiepolicy' : 'single_Host_Origin',
            'callback' : 'loginCallback',
            'approvalprompt':'force',
            'scope' : 'https://www.googleapis.com/auth/plus.login https://www.googleapis.com/auth/plus.profile.emails.read'
          };
          gapi.auth.signIn(myParams);
        }

        function loginCallback(result)
        {
            if(result['status']['signed_in'])
            {
                var request = gapi.client.plus.people.get(
                {
                    'userId': 'me'
                });
                request.execute(function (resp)
                {
                    /* console.log(resp);
                    console.log(resp['id']); */
                    var email = '';
                    if(resp['emails'])
                    {
                        for(i = 0; i < resp['emails'].length; i++)
                        {
                            if(resp['emails'][i]['type'] == 'account')
                            {
                                email = resp['emails'][i]['value'];//here is required email id
                            }
                        }
                    }
                   var usersname = resp['displayName'];//required name
                });
            }
        }
        function onLoadCallback()
        {
            gapi.client.setApiKey('YOUR_API_KEY');
            gapi.client.load('plus', 'v1',function(){});
        }

            </script>

        <script type="text/javascript">
              (function() {
               var po = document.createElement('script'); po.type = 'text/javascript'; po.async = true;
               po.src = 'https://apis.google.com/js/client.js?onload=onLoadCallback';
               var s = document.getElementsByTagName('script')[0]; s.parentNode.insertBefore(po, s);
             })();
        </script>
1
A J

Sie können in openId ( http://openid.net/ ) nachschauen, was SO verwendet und von Google unterstützt wird.

0
jd.