title: Google + SignIn Button Blocked Frame
body: <p>I have been trying to build a kind of <em>Hello World</em> project using Google + SignIn. I followed the tutorial at <a href="https://developers.google.com/+/web/signin/" rel="nofollow">https://developers.google.com/+/web/signin/</a>, with my (excerpted) code being:</p>
  
  <pre><code>...
  &lt;script&gt;
          function signinCallback(authResult) {
          //location.reload();
          //var x = 0
          //while(x=0){
              if (authResult['access_token']) {
                  // Successfully authorized
                   // Hide the sign-in button now that the user is authorized, for example:
                   document.getElementById('signinButton').setAttribute('style', 'display: none');
                  //document.getElementById("secret").innerHTML = ("&lt;a href="secret.html"&gt;&lt;p&gt;Non-Conspicuous Link to Super Secret Page&lt;/p&gt;&lt;/a&gt;");
                  //alert("IT WORKED");
                  document.getElementById("secret").innerHTML=("Non-Conspicuous Link to Super Secret Page");
                  document.getElementById("game").innerHTML=("Non-Conspicuous Link to Super Secret Game Page");
                  document.getElementById('refresh').setAttribute('style', 'display: none');
                  //alert("Please Refresh");
                   } else if (authResult['error']) {
                   // There was an error.
                   // Possible error codes:
                   //   "access_denied" - User denied access to your app
                   //   "immediate_failed" - Could not automatically log in the user
                   console.log('AuthERROR: ' + authResult['error']);
                  //alert("ERROR: A team of poorly trained robots has been dispatched to handle the situation. If they arive, tell them '" + authResult['error'] + "'");
                }
              }
          &lt;/script&gt;
  ...
  &lt;span id="signinButton"&gt;
          &lt;span 
              class="g-signin"
              data-callback="signinCallback"
              data-clientid="CLIENT ID"
              data-cookiepolicy="single_host_origin"
              data-requestvisibleactions="http://schemas.google.com/AddActivity"
              data-scope="https://www.googleapis.com/auth/plus.login"
              data-width="wide"
              data-theme="light"&gt;
          &lt;/span&gt;
  ...
  &lt;a href="secret.html"&gt;&lt;p id="secret"&gt;&lt;/p&gt;&lt;/a&gt;
  ...
  </code></pre>
  
  <p>When I run the code in Google Chrome (Version 29.0.1547.18 dev-m), I get this error:</p>
  
  <pre><code>Blocked a frame with origin "https://accounts.google.com" from accessing a frame with origin "https://apis.google.com". Protocols, domains, and ports must match.
  </code></pre>
  
  <p>The code in my signinCallback function is called on the page's first load, but doesn't run when the button is used for sign in. The code isn't executed until the page is reloaded.</p>
  
  <p>However, this issue does not occur in Firefox, so it seems to be an error isolated to Chrome. I have not yet tested any other browsers.</p>
  
  <p>Is there anyway to solve this issue?</p>
  
  <p>Thanks!</p>