2

I am trying to make google sign in work on my intranet site which currently uses integrated windows authentication - I want to get away from that because I need to support ChromeBooks and pretty much everything here is going google......

This is what IS working:

  • I get a sign in button. I can see in the console log that it is using my google developer client id:

XHR finished loading: GET "https://accounts.google.com/o/oauth2/iframerpc?action=checkOrigin&origin=ht…d=777682448638-5tpyaddayaddyadddarvnbr3p6.apps.googleusercontent.com".

  • If I click the button on a machine where I am not logged into google I will geta prompt to log into google.

  • If I click the button on a machine where I am logged into google but have not visited this site before then I will get the authorization request for my email and profile to be shared with my web application.

    • If I have done the above, and click the button then there is a flash of a pop-up window that goes away immediately.

What is NOT working:

  • My website never gets any onSuccess back....... so the button ALWAYS says "Sign in with Google" I don't get to the next step of "Signed in as molly ......"

Here is a shortended version of my code - please note that right now my website uses the integrated windows authentication - that is what I am trying to port away from so we can use ChromeBooks and other computers that are not using our windows login.

this is from my _Layout.cshtml page

    @{
        var username = WebSecurity.CurrentUserName;
    }

    <!DOCTYPE html>
    <html lang="en">
    <head>
        <title>Rutland City Public Schools - ACADEMIC SITE</title>
        <link href="~/Styles/Styles.css" rel="stylesheet" type="text/css"/>
        <link href="~/Styles/PrintStyles.css" rel="stylesheet" type="text/css" media="print"/>
        <meta http-Equiv="Cache-Control" Content="no-cache">
        <meta http-Equiv="Pragma" Content="no-cache">
        <meta http-Equiv="Expires" Content="0">
        <script src="//code.jquery.com/jquery-1.11.0.min.js"></script>
        <script src="//code.jquery.com/jquery-migrate-1.2.1.min.js"></script>
        @RenderSection("script", required: false)
        <meta name="google-signin-scope" content="profile email">
        <meta name="google-signin-client_id" content="777682448638-5tpyaddayaddayaddavnbr3p6.apps.googleusercontent.com">

    </head>

    <body>

          <div id="topRight">  
              Hello: @username   <br> <br> 

                <div id="my-signin2" align="center" ></div>
                  <script>
                    function onSuccess(googleUser) {
                      console.log('Logged in as: ' + googleUser.getBasicProfile().getName());
                    }
                    function onFailure(error) {
                      console.log(error);
                    }
                    function renderButton() {
                      gapi.signin2.render('my-signin2', {
                        'scope': 'https://www.googleapis.com/auth/plus.login',
                        'width': 150,
                        'height': 30,
                        'longtitle': true,
                        'theme': 'light',
                        'onsuccess': onSuccess,
                        'onfailure': 'oops!'
                      });

                    }
                  </script>

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

              ignore google button!
          </div>

          <div id="mainContent">
               @RenderBody()
          </div> 

    </body> 

    </html>

If I open up "Inspect Element" when I am in chrome I can see that under the network tab it clearly goes off and does some gets to google. In the console tab I only see the XHR finished loading: GET "https://accounts.google................." message.

What is going on here? Why am I not getting the onSuccess?

Thank you!!!!

Added more notes:

I added a link:

 <a href="#" onclick="signIn();">Sign in</a>

that calls this function:

 function signIn() {
    var auth2 = gapi.auth2.getAuthInstance();
    console.log(auth2);

From the console results I can see my website, and my client id, but again I see nothing about my actual user.

jF {zd: Object, po: "single_host_origin", zt: true, ha: true, G: undefined…}
B: bY
B: "777682448638-5tp3rss17g1qarc3em0opcr4rvnbr3p6.apps.googleusercontent.com"
Db: "http://rcps"
Ei: undefined
El: undefined
G: "google"
Ka: false
Ld: Object
openid.realm: undefined
redirect_uri: "http://rcps/academic/academic"
response_type: "token id_token"
scope: "openid profile email"
user3795152
  • 73
  • 10
  • Is there no error response? – Andy Jun 17 '15 at 16:11
  • No there is not error - on I think onError and OnSuccess are not being detected - which makes me think they maybe it is not really logging in OR it knows who my account is, but the message is not coming back. – user3795152 Jun 17 '15 at 17:02

3 Answers3

0

With the Google Sign-In (gapi.auth2) JavaScript client libraries, you should probably be using listeners to check the state of the client. I'm not sure exactly how you're rendering the button but you might want to take a good look at the Google Sign-in quickstart.

Although I have found using listeners to have advantages over using the success callback, the following code works for me (I see onWin upon sign-in with the z variable containing the authorization response):

function onFail(z){ alert('Fail' + JSON.stringify(z)); }                                                                                  
function onWin(z){ alert('Win' + JSON.stringify(z)); }
gapi.load('auth2', function() {
  gapi.signin2.render('signin-button', {
    scope: 'https://www.googleapis.com/auth/plus.login',
    onsuccess: onWin,                                                     
    onfail: onFail,   
    fetch_basic_profile: false });
  gapi.auth2.init({fetch_basic_profile: false,
      scope:'https://www.googleapis.com/auth/plus.login'}).then(
          function (){
            console.log('init');
            auth2 = gapi.auth2.getAuthInstance();
            auth2.isSignedIn.listen(updateSignIn);
            auth2.then(updateSignIn());
          });
});

Do things when sign-in changes (e.g. show/hide authorized UI):

var updateSignIn = function() {
  console.log('update sign in state' + auth2.isSignedIn.get());
}

At any point when auth2.isSignedIn.get() returns true, you can use auth2.currentUser.get() to retrieve the profile data for the currently signed in user.

class
  • 8,621
  • 29
  • 30
  • Hi Class - I am getting a strange result from this. I am assuming that the lines of code should go:
    where I take out the onload call to the function.     – user3795152 Jun 18 '15 at 12:59
  • continued - I then replaced my function call with the gapi.load('auth2', function() { .............. and what happens then is I get no button. This says to me that rendering the button works fine - clicking on it works ok to get me to the consent screen, but the bits after that do not work. – user3795152 Jun 18 '15 at 13:02
  • Now back on the google developer end I only have a URL, I do not have a redirect url set - that is what the developer guides say to do. I cannot even put in a redirect one because my site is an internal one and does not end with .org or .com which the configuration tool seems to require now. – user3795152 Jun 18 '15 at 13:04
  • Your script src looks a little off, try ` – class Jun 18 '15 at 18:46
  • You're encountering issues on script load because you are not loading all the required libraries and have an empty query parameter. The redirect URI cannot be a non-public because of the way that the redirect flow works. You can use the postmessage flow, as demonstrated in the language-specific (Go, PHP, .NET, Ruby, etc) samples on https://github.com/googleplus. – class Jun 18 '15 at 20:21
0

I had similar problems when testing on localhost. When I pushed my code onto my production server the simple example provided by Google worked perfectly as advertised. The button's values changes or stays accordingly even after a page refresh.

Cyrille
  • 3,427
  • 1
  • 30
  • 32
0

Perhaps your browser is configured to block third party cookies. If so, disable that feature. You may also want to have a note on your login page mentioning that third party cookies are required so that your users will know to do the same.

ccm
  • 356
  • 2
  • 7