2013-03-18 10 views
24

Sono in procinto di integrare Google+ per accedere con il mio sito, che consente anche agli utenti di accedere con Twitter e Facebook. La pagina di accesso del sito ha quindi 3 pulsanti, uno per ciascuno dei servizi.Prevenire l'accesso automatico quando si utilizza l'accesso a Google+

Il problema che sto avendo è nel seguente scenario:

  • utente va alla pagina di accesso
  • utente accede con successo con G +
  • segni di utenti fuori del mio sito (ma il conto è ancora associato a G +, la disconnessione dal sito non scollega l'account G +)
  • l'utente visita nuovamente la pagina di accesso
  • in questa fase il pulsante Accedi con G + viene visualizzato e automaticamente firma l'utente nell'account associato a G + senza che l'utente debba fare clic sul pulsante

Il problema è che alla rivisitazione della pagina di accesso, voglio che l'utente abbia la possibilità di accedere con un altro servizio, piuttosto di essere automaticamente connessi con G +. Se l'utente desidera accedere con G +, può farlo facendo clic sul pulsante: l'utente verrà quindi autenticato automaticamente.

È possibile impedire l'accesso automatico al rendering del pulsante? Posso simularlo usando lo data-approvalprompt="force" come un attributo sul pulsante, ma non penso che questa sia una soluzione ideale (l'utente deve quindi passare attraverso il processo di conferma, cosa che vorrei idealmente evitare)

risposta

23

Aggiornamento

il miglior modo sostenuto per prevenire l'accesso automatico è quello di utilizzare il metodo API gapi.auth2.getAuthInstance().signOut() che impedirà l'accesso automatico sul tuo sito dopo che è stato chiamato. Demo here.

Nella demo, l'utente viene disconnesso quando lasciano la pagina come illustrato nel codice seguente:

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

Ora, ogni volta che l'utente esce dal sito (ad esempio chiude la finestra, naviga via), verranno disconnessi e il pulsante di accesso non attiverà l'accesso finché l'utente non farà clic.

Non ti consiglio di farlo nella tua implementazione, ma invece permetti all'utente di uscire esplicitamente quando non desiderano più essere registrato. Inoltre, il mio esempio è una demo, probabilmente lo fai non voler disconnettere l'utente automaticamente ogni volta che lascia il tuo sito.

originale Messaggio

In primo luogo, non si dovrebbe usare i dati-approvalprompt = "forza", come questo farà sì che subtokens più autorizzate da emettere alla tua applicazione/cliente ed è progettato per essere utilizzato in scenari in cui l'utente deve essere nuovamente autorizzato dopo che le credenziali sono state perse dal lato server.

In secondo luogo, probabilmente non si desidera avere il comportamento in cui l'utente deve fare clic per accedere perché sono già "connessi" al proprio account Google e potrebbe essere fonte di confusione per accedere (o attivare il segno -in) di nuovo, separatamente, per il tuo sito.

Se si voleva davvero fare questo, è necessario eseguire un esplicito rendono per il pulsante signin ma non avrebbe fatto la chiamata a gapi.signin.render come documentato nella Google+ sign-in documentation finché non si è consapevoli del fatto che l'utente non automaticamente ottenere firmato nel

il codice seguente mostra come abilitare esplicitamente rendering del pulsante di accesso:.

<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 
} 

il codice seguente mostra come eseguire il rendering in modo esplicito il tasto:

0.123.

Come stai comunicando che l'utente è disconnesso dal tuo sito probabilmente cambierà da sito a sito, ma un approccio potrebbe essere quello di impostare un cookie che indica lo stato "disconnesso" per un utente e quindi usando questo come trigger per bloccare il carico esplicito. Il comportamento diventa un po 'più complicato quando un utente visita il tuo sito e ha disabilitato i cookie o utilizza un browser separato e connesso. Per risolvere il problema, potresti fare qualcosa di complicato come interrogare lo stato dell'utente dal tuo server su XHR sul callback di accesso e fingere di non sapere che l'utente ha effettuato l'accesso a Google+.

+0

Può comunque cambiare il formato del pulsante, guarda nella mia domanda: http://stackoverflow.com/questions/21984213/google-plus-sign-in-in-checkbox – Bazinga

+0

window.onbeforeunload non funziona su chrome perché così ? hai affrontato lo stesso problema – Vartika

+1

Usa questo se usi la nuova firma di google nella api: '' 'gapi.auth2.getAuthInstance(). signOut()' '' –

24

Basta controllare per g-auth-finestra nella funzione di callback:

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

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

     } 
    } 
+0

Ho confrontato le risposte ma certamente ho mancato 'g-oauth- finestra'. Grazie! – Malte

+0

Hah: D bel trucco: D – techouse

+9

Un altro modo è controllare 'authResult.status.method'. Sarà impostato su 'PROMPT' se l'utente ha avviato la richiesta (al contrario di' AUTO'). – alecananian

2

Purtroppo chiamando gapi.auth.signOut() fatto l'applicazione di log-in di nuovo quando sto chiedendo i dati utente (non è persistente)

Quindi la soluzione, come suggerito da @class è di revocare il token:

$.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

la nostra soluzione era AngularJS:

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

È importante notare che questa risposta si applica alla direttiva angolare 'google-plus-signin'. 'google-plus-signin-success' viene trasmesso quando l'accesso viene eseguito con successo e include l'accesso all'account Google e la visualizzazione del pulsante di accesso Google. – Alexei

2

Anch'io ha questo stesso problema come ho fissato it.I non possono certo questo è un modo stander per farlo, ma ancora funziona bene con me ...

aggiungere questo Google JS da google sviluppatore

<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 
    }); 
} 

Ora aggiungiamo il collegamento html e onClick chiamare questa funzione renderGmail().

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

Spero che questo funziona ...

2

Sto usando https://developers.google.com/identity/sign-in/web/build-button per costruire il pulsante Accedi per il mio web app che fornisce all'utente una scelta di accedere sia attraverso Facebook o Google. Questo codice è piuttosto semplice per ottenere Id_token. Tuttavia, anche con l'accesso automatico dell'utente se l'utente è già registrato.

Quindi, aggiungendo il seguente frammento all'inizio dello script mi ​​ha aiutato a controllare la procedura di registrazione.

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

Grazie!

1

ho lottato con questo per un po 'e non sono riuscito a trovare un modo per prevenire l'accesso automatico a Google utilizzando il "facile implementazione" del Segno-in

ho finito per usare il custom integration che non lo fa tentativo di Accesso automatico (anche mi ha permesso di modificare l'aspetto allo stesso tempo)

4

ho avuto questo problema e utilizzato auth2.disconnect()

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

    //do other stuff 
} 

Edit: è necessario memorizzare il token essere ribalta si disconnette perché in alcuni casi id_token diventerà nullo dopo la disconnessione:

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

    //use idToken for server side verification 
} 

se sono corrette avete il proprio segno nel meccanismo per il tuo sito e solo bisogno di google accedere a firmare un utente su email verificato . in questo caso puoi facilmente disconnetterti dopo aver ottenuto le informazioni sul profilo. La prossima volta che caricerai la pagina vedrai il pulsante "accedi" invece del pulsante "accesso".

+0

in realtà ha fatto il trucco per me !!! grazie mille !!! – Saibbyweb

+1

Questo è stato super utile! Alla fine ho utilizzato [googleUser.disconnect() '] (https://developers.google.com/identity/sign-in/web/reference#googleuserdisconnect). La documentazione dice cose leggermente diverse per i due metodi, ma non sono sicuro che facciano cose diverse. –

+0

Grazie neal ha appena provato googleUser.disconnect() e ha fatto lo stesso –

Problemi correlati