Menu
I'm trying the follow the Google+ guidance to start a Google+ Sign in flow using my own button.
Concerning the callback function, the gapi.auth.signIn reference says (quote):
"A function in the global namespace, which is called when the sign-in button is rendered and also called after a sign-in flow completes."
The Google Sign in dialog appears, asking me to sign in, but the callback is called twice immediately, before any interaction is made with the dialog. Both times I get a similar authResult, with error="immediate_failed", error_subtype="access_denied", status.signed_in=false
Why is that?
<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN">
<html>
<head>
<meta http-equiv=Content-Type content="text/html; charset=utf-8" />
<script src="https://apis.google.com/js/client:platform.js?onload=googleRender" async defer></script>
</head>
<body>
<script>
function googleRender() { // executed when Google APIs finish loading
var googleSigninParams = {
'clientid' : '746836915266-a016a0hu45sfiouq7mqu5ps2fqsc20l4.apps.googleusercontent.com',
'cookiepolicy' : 'http://civoke.com',
'callback' : googleSigninCallback ,
'requestvisibleactions' : 'http://schema.org/AddAction',
'scope' : 'https://www.googleapis.com/auth/plus.login'
};
var googleSigninButton = document.getElementById('googleSigninButton');
googleSigninButton.addEventListener('click', function() {
gapi.auth.signIn(googleSigninParams);
});
}
function googleSigninCallback(authResult) {
console.log('googleSigninCallback called: ');
console.dir(authResult);
if (authResult['status']['signed_in']) {
document.getElementById('googleSigninButton').setAttribute('style', 'display: none'); // hide button
console.log('User is signed-in to Google');
} else {
console.log('User is NOT signed-in. Sign-in state: ' + authResult['error']);
}
}
</script>
<button id="googleSigninButton">Sign in with Google</button>
</body>
</html>
431
Callback function is called always when the status has changed, not only when user logs in. In googleSigninCallback(authResult), you should at first check if the user has signed in and then you should check, if the method value is AUTO or PROMPT. PROMPT should be returned only once when the users logs in and that's what you need. Here's the code:
function googleSigninCallback(authResult) {
if (authResult['status']['signed_in'] && authResult['status']['method'] == 'PROMPT') {
// User clicked on the sign in button. Do your staff here.
} else if (authResult['status']['signed_in']) {
// This is called when the status has changed and method is not 'PROMPT'.
} else {
// Update the app to reflect a signed out user
// Possible error values:
// "user_signed_out" - User is signed-out
// "access_denied" - User denied access to your app
// "immediate_failed" - Could not automatically log in the user
console.log('Sign-in state: ' + authResult['error']);
}
If you love us? You can donate to us via Paypal or buy me a coffee so we can maintain and grow! Thank you!
Donate Us With
