it-swarm.com.de

Automatische Anmeldung bei der Google+ Anmeldung verhindern

Ich baue gerade die Google+ Anmeldung in meine Website ein, wodurch sich auch die Nutzer bei Twitter und Facebook anmelden können. Die Anmeldeseite der Site verfügt daher über drei Schaltflächen, eine für jeden Dienst.

Ich habe ein Problem in folgendem Szenario:

  • benutzer geht zur Anmeldeseite
  • benutzer meldet sich erfolgreich mit G + an
  • benutzer meldet sich von meiner Site ab (das Konto ist jedoch weiterhin mit G + verbunden. Durch das Abmelden von der Site wird das G + Konto nicht getrennt.)
  • benutzer besucht die Anmeldeseite erneut
  • in diesem Stadium wird die Schaltfläche Anmelden mit G + gerendert und der Benutzer wird automatisch in das mit G + verknüpfte Konto angemeldet, ohne dass der Benutzer auf die Schaltfläche klicken muss

Das Problem ist, dass ich beim erneuten Aufrufen der Anmeldeseite möchte, dass der Benutzer die Möglichkeit hat, sich bei einem anderen Dienst anzumelden, anstatt automatisch bei G + angemeldet zu werden. Wenn sich der Benutzer bei G + anmelden möchte, kann er dies durch Klicken auf die Schaltfläche tun. Der Benutzer wird dann automatisch angemeldet.

Kann man diese automatische Anmeldung beim Rendern der Schaltfläche verhindern? Ich kann es simulieren, indem ich data-approvalprompt="force" als Attribut für die Schaltfläche verwendet, aber ich denke nicht, dass dies eine ideale Lösung ist (der Benutzer muss dann den Bestätigungsprozess durchlaufen, was ich idealerweise verhindern möchte).

31
lamplightdev

Update

Um die automatische Anmeldung am besten zu verhindern, verwenden Sie die API-Methode gapi.auth2.getAuthInstance().signOut(), mit der die automatische Anmeldung an Ihrer Site nach dem Aufruf verhindert wird. Demo hier .

In der Demo wird der Benutzer abgemeldet, wenn er die Seite verlässt, wie im folgenden Code dargestellt:

window.onbeforeunload = function(e){
  gapi.auth2.getAuthInstance().signOut();
};

Immer wenn der Benutzer die Site verlässt (z. B. schließt er das Fenster, navigiert weg), werden sie abgemeldet, und die Anmeldeschaltfläche löst keine Anmeldung aus, bis der Benutzer auf sie klickt.

Ich empfehle Ihnen jedoch nicht, dies in Ihrer eigenen Implementierung zu tun. Stattdessen erlauben Sie dem Benutzer, sich explizit abzumelden, wenn er nicht mehr angemeldet werden möchte. Beachten Sie außerdem, dass mein Beispiel eine Demo ist, die Sie wahrscheinlich nicht signieren möchten Der Benutzer wird automatisch ausgezogen, sobald er Ihre Site verlässt.

Ursprünglicher Beitrag

Erstens sollten Sie nicht data-approvedprompt = "force" verwenden, da dies dazu führt, dass zusätzliche genehmigte Subokens für Ihre Anwendung/Ihren Client ausgegeben werden. Diese Option ist für die Verwendung in Szenarios vorgesehen, in denen der Benutzer nach dem Verlust der Anmeldeinformationen des Servers erneut autorisiert werden muss -Seite. 

Zweitens möchten Sie wahrscheinlich nicht das Verhalten haben, bei dem der Benutzer zum Anmelden klicken muss, weil er bereits bei seinem Google-Konto "angemeldet" ist und es verwirrend sein kann, sich erneut anzumelden (oder die Anmeldung erneut auszulösen) separat für Ihre Website.

Wenn Sie dies wirklich tun möchten, führen Sie ein explizites Rendering für die Anmeldeschaltfläche aus, rufen jedoch nicht den in der Google+ Anmeldedokumentation dokumentierten Abstandshalter auf, bevor Sie dies bemerken Der Benutzer wird nicht automatisch angemeldet.

Der folgende Code zeigt, wie das explizite Rendern der Anmeldeschaltfläche aktiviert wird:

<script type="text/javascript" src="https://apis.google.com/js/plusone.js">
{"parsetags": "explicit"}
</script>
<script src="//ajax.googleapis.com/ajax/libs/jquery/1.9.1/jquery.min.js"></script>
<head>
<script type="text/javascript">
var token = "";
function onSigninCallbackVanilla(authResponse){
   // in a typical flow, you show disconnect here and hide the sign-in button
}

Der folgende Code zeigt, wie die Schaltfläche explizit gerendert wird:

  <span id="signinButton">
    <button id = "shim" onclick="gapi.signin.go(); $('#shim').hide();">Show the button</button>
    <span
      class="g-signin"
      data-callback="onSigninCallbackVanilla"
      data-clientid="YOUR_CLIENT_ID"
      data-cookiepolicy="single_Host_Origin"
      data-requestvisibleactions="http://schemas.google.com/AddActivity"
      data-scope="https://www.googleapis.com/auth/plus.login">

    </span>
  </span>  

Wie Sie kommunizieren, dass der Benutzer von Ihrer Site abgemeldet ist, wird sich wahrscheinlich von Site zu Site unterscheiden. Ein Ansatz könnte darin bestehen, ein Cookie zu setzen, das den Status "Abgemeldet" für einen Benutzer angibt, und diesen dann als Auslöser zu verwenden um das explizite Laden zu blockieren. Das Verhalten wird etwas schwieriger, wenn ein Benutzer Ihre Website besucht und Cookies deaktiviert hat oder einen separaten, angemeldeten Browser verwendet. Um dies zu beheben, könnten Sie etwas kompliziertes tun, wie den Benutzerstatus von Ihrem Server über XHR beim Anmelden-Rückruf abzufragen und so zu tun, als würden Sie nicht wissen, dass der Benutzer bei Google+ angemeldet ist.

28
class

Suchen Sie einfach nach g-auth-window in der Callback-Funktion:

    function google_sign_callback(authResult){
        if(authResult['g-oauth-window']){

        }else if(authResult['error']) {

        }
    }
25
Jacket

Ich hatte dieses Problem und benutzte auth2.disconnect ()

function onSignIn(googleUser) {
    var profile = googleUser.getBasicProfile();
    var auth2 = gapi.auth2.getAuthInstance();
    auth2.disconnect();

    //do other stuff
}

Edit: Sie müssen das Token speichern, bevor Sie die Verbindung trennen, da id_token in einigen Fällen nach der Verbindung zu null wird:

function onSignIn(googleUser) {
    var profile = googleUser.getBasicProfile();
    var idToken=profile.id_token;
    googleUser.disconnect()

    //use idToken for server side verification
}

Wenn ich richtig liege, verfügen Sie über einen eigenen Anmeldemechanismus für Ihre Website. Sie benötigen lediglich eine Google-Anmeldung, um einen Benutzer mit einer bestätigten E-Mail-Adresse zu registrieren. In diesem Fall können Sie die Verbindung leicht trennen, nachdem Sie die Profilinformationen erhalten haben. Wenn Sie die Seite das nächste Mal laden, wird die Schaltfläche "Anmelden" und nicht die Schaltfläche "Anmelden" angezeigt.

9
Alireza Rinan

Ich verwende https://developers.google.com/identity/sign-in/web/build-button , um den Anmeldebutton für meine Web-App zu erstellen, der dem Benutzer die Möglichkeit gibt, sich über Facebook anzumelden oder Google . Dieser Code ist ziemlich einfach, um das Id_token zu erhalten. Es kam jedoch auch zu einer automatischen Anmeldung des Benutzers, wenn der Benutzer bereits angemeldet ist.

Das Hinzufügen des folgenden Snippets am Anfang des Skripts half mir somit, die Anmeldeprozedur zu steuern.

    window.onbeforeunload = function(e){
      gapi.auth2.getAuthInstance().signOut();
    };

Vielen Dank!

3
Taani

Beim Aufruf von gapi.auth.signOut() hat sich die App leider veranlasst, sich erneut anzumelden, wenn ich Benutzerdaten anfordert.

Die von @class vorgeschlagene Lösung besteht also darin, das Token zu widerrufen:

  $.ajax({
    type: 'GET',
    url: 'https://accounts.google.com/o/oauth2/revoke?token=' +
        gapi.auth.getToken().access_token,
    async: false,
    contentType: 'application/json',
    dataType: 'jsonp',
    success: function(result) {
      console.log('revoke response: ' + result);
      $('#authOps').hide();
      $('#profile').empty();
      $('#visiblePeople').empty();
      $('#authResult').empty();
      $('#gConnect').show();
    },
    error: function(e) {
      console.log(e);
    }
  });
3

Ich habe auch das gleiche Problem wie ich es behoben habe. Ich bin mir vielleicht nicht sicher, ob dies ein standerer Weg ist, aber es funktioniert trotzdem gut mit mir ...

fügen Sie diese Google JS von Google Developer hinzu 

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

function onSuccessG(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());
}
function onFailureG(error) {
    console.log(error);
}
function renderGmail() {

  gapi.signin2.render('my-signin2', {
    'scope': 'https://www.googleapis.com/auth/plus.login',
    'width': 0,
    'height': 0,
    'longtitle': true,
    'theme': 'dark',
    'onsuccess': onSuccessG,
    'onfailure': onFailureG
  });
}

Fügen Sie nun HTML-Link hinzu und rufen Sie onClick mit der Funktion renderGmail () auf.

<a href="javascript:void(0)" onclick="renderGmail();"> SignUp with Gmail</a>

Ich hoffe das funktioniert...

3
Amin Kodaganur

Unsere AngularJS-Lösung war:

$scope.$on('event:google-plus-signin-success', function (event, authResult) {
                if( authResult.status.method !== "AUTO"){
                    onGoogleLogIn(authResult[settings.configKeys.googleResponseToken]);
                }
            });
2
Jack Stone

Ich habe seit einiger Zeit damit zu kämpfen und konnte keine Möglichkeit finden, die automatische Anmeldung bei Google mithilfe der "einfachen Implementierung" der Anmeldung zu verhindern

Am Ende benutzte ich die benutzerdefinierte Integration , die nicht versucht, sich automatisch anzumelden (erlaubte mir auch, das Erscheinungsbild gleichzeitig zu ändern).

1
Florin D

Ich habe dieses Problem gelöst, indem ich meiner Google-Anmeldeschaltfläche einen Klick-Handler hinzugefügt habe. Der Click-Handler legt eine globale Javascript-Variable google_sign_in auf true fest. Wenn der onSuccess()-Handler ausgelöst wird (entweder automatisch beim Laden der Seite oder manuell, wenn der Benutzer auf die Anmeldeschaltfläche klickt), prüft er zunächst, ob google_sign_in == true, und meldet den Benutzer nur dann an:

<div id="google-signin2" onclick="return do_click_google_signin();"></div>

<script>
    var google_sign_in = false; // assume

    function do_click_google_signin() {
        google_sign_in = true;
    }

    function onSuccess( googleUser ) {
        if ( google_sign_in ) {
            // Process sign-in
        }
    }

    // Other redundant login stuff not shown...
</script>
0
kmoser