title: The data-onsuccess function is not called when using Google-Sign in Javascript
body: <p>I want the user to be able to sign in with his Google account in his web browser. However, the data-onsuccess method isn't being called.</p>
  
  <p>I uploaded a .html file with the sign in code to my webspace, created a Google API project with the relevant settings. I can see see login button. I can click it and input my Google account data and allow my application to access my account. However, the  data-onsuccess method isn't called and so I cannot react to the successful login.</p>
  
  <p>I tried the login with the <a href="https://developers.google.com/identity/sign-in/web/" rel="noreferrer">umodified example code</a> from Google and my own code where I added some debugging to see if JS is working at all:</p>
  
  <pre><code>&lt;!DOCTYPE html&gt;
  &lt;html&gt;
      &lt;head&gt;
          &lt;meta charset="utf-8" /&gt;
          &lt;meta name="google-signin-scope" content="profile email"&gt;
          &lt;meta name="google-signin-client_id" content="CORRECT_VALUE_HERE.apps.googleusercontent.com"&gt;
          &lt;script src="https://apis.google.com/js/platform.js" async defer&gt;&lt;/script&gt;
          &lt;title&gt;Google sign in test&lt;/title&gt;
      &lt;/head&gt;
      &lt;body&gt;
          &lt;h1&gt;Google sign in test&lt;/h1&gt;
          &lt;div class="g-signin2" data-onsuccess="onSignIn"&gt;&lt;/div&gt;
          &lt;br&gt;
          &lt;a href="#" onclick="signOut();"&gt;Sign out&lt;/a&gt;
          &lt;br&gt;
          &lt;a href="index.html"&gt;Back&lt;/a&gt;
          &lt;br&gt;
          &lt;a href="#" onclick="someTest()"&gt;JavaScript Test&lt;/a&gt;
          &lt;br&gt;
          &lt;ul&gt;
              &lt;li id="gID"&gt;Google ID, temporary&lt;/li&gt;
              &lt;li id="gFullName"&gt;Full Name&lt;/li&gt;
              &lt;li id="gGivenName"&gt;Given Name&lt;/li&gt;
              &lt;li id="gFamilyName"&gt;FamilyName&lt;/li&gt;
              &lt;li id="gImg"&gt;Image URL&lt;/li&gt;
              &lt;li id="gEMail"&gt;E-Mail&lt;/li&gt;
              &lt;li id="gToken"&gt;Google Token, permanent&lt;/li&gt;
          &lt;/ul&gt;
          &lt;script&gt;
              function onSignIn(googleUser) {
                  alert('in onSignIn');
                  // Useful data for your client-side scripts:
                  var profile = googleUser.getBasicProfile();
                  document.getElementById('gID').textContent = profile.getId();
                  document.getElementById('gFullName').textContent = profile.getName();
                  document.getElementById('gGivenName').textContent = profile.getGivenName();
                  document.getElementById('gFamilyName').textContent = profile.getFamilyName();
                  document.getElementById('gImg').textContent = profile.getImageUrl();
                  document.getElementById('gEMail').textContent = profile.getEmail();
  
                  // The ID token you need to pass to your backend:
                  var id_token = googleUser.getAuthResponse().id_token;
                  document.getElementById('gToken').textContent = id_token;
              };
              function someTest() {
                  alert('js is working');
                  var x = {};
                  x.getBasicProfile = function() {
                      var y = {};
  
                      y.getId = function() { return 'fake id'; };
                      y.getName = function() { return 'fake fake full name'; };
                      y.getGivenName = function() { return 'fake fake given name'; };
                      y.getFamilyName = function() { return 'fake fake family name'; };
                      y.getImageUrl = function() { return 'fake image'; };
                      y.getEmail = function() { return 'fake e-mail'; };
  
                      return y;
                  };
  
                  x.getAuthResponse = function() {
                      var z = {}
  
                      z.id_token = 'fake id token';
  
                      return z;
                  };
  
                  onSignIn(x);
  
              };
              function signOut() {
                  var auth2 = gapi.auth2.getAuthInstance();
                  auth2.signOut().then(function () {
                      console.log('User signed out.');
                  });
              };
          &lt;/script&gt;
      &lt;/body&gt;
  &lt;/html&gt;
  </code></pre>
  
  <p>I don't see any error messages in my browser or my http server. Can anybody tell me what I am doing wrong?</p>
  
  <p>Things I already tried/checked:</p>
  
  <ul>
  <li>I check that my client_id in the meta-tag is correct, several times.</li>
  <li>I am sure I set the correct "Authorized JavaScript origin". Otherwise I would see and error message during the loging screen.</li>
  <li>I am sure I am using a correct login. I can can see my example application among the authorized sites in my google account settings.</li>
  <li>I tried moving the script-tag above the div-tags. It doesn't matter. I made sure onSignIn() is a top level JS function.</li>
  <li>I tried hosting this .html file somewhere else (in case Heroku blocks this process somehow). It didn't help.</li>
  <li>I tried this in up to date Firefox and Chrome on Linux and Windows. No difference.</li>
  </ul>