Question

令人困惑的快速问题。

我正在关注I / O '12（link）中的示例，我得到了它的工作但是由于某种原因，在我授予访问权限后，窗口进入白屏，标题显示为“正在连接”。 ..“并留在那里。控制台中没有错误，就OAuth身份验证而言，我很乐意。

我想指出我在Chrome扩展程序的弹出窗口中使用page action执行此操作。我不知道这是否有所不同。

该示例的演示效果很好所以我认为它与在chrome扩展中的内容有关。我只是无法弄清楚它可能是什么。 demo

我使用的代码与示例完全相同：

JS /的OAuth / oauth.js：

  var clientId = '[MY_CLIENTID]';
  var apiKey = '[MY_API_KEY]';
  var scopes = 'https://www.googleapis.com/auth/plus.me';

  // Use a button to handle authentication the first time.
  function handleClientLoad() {
    gapi.client.setApiKey(apiKey);
    window.setTimeout(checkAuth,1);
  }
  function checkAuth() {
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: true}, handleAuthResult);
  }
  function handleAuthResult(authResult) {
    var authorizeButton = document.getElementById('authorize-button');
    var flows = document.getElementById('flows');
    var welcome = document.getElementById('welcome');

    if (authResult && !authResult.error) {
      flows.style.display = 'none';
      welcome.style.display = '';
      makeApiCall();
    } else {
      flows.style.display = '';
      welcome.style.display = 'none';
      authorizeButton.onclick = handleAuthClick;
    }
  }
  function handleAuthClick(event) {
    gapi.auth.authorize({client_id: clientId, scope: scopes, immediate: false}, handleAuthResult);
    return false;
  }
  // Load the API and make an API call.  Display the results on the screen.
  function makeApiCall() {
    gapi.client.load('plus', 'v1', function() {
      var request = gapi.client.plus.people.get({
        'userId': 'me'
      });
      request.execute(function(resp) {
        var heading = document.createElement('p');
        var image = document.createElement('img');
        image.src = resp.image.url;

        var welcometext = document.createTextNode("Welcome ");
        var welcometextend = document.createTextNode(", you are now logged in!");

        heading.appendChild(welcometext);
        heading.appendChild(document.createTextNode(resp.displayName));
        heading.appendChild(welcometextend);

        document.getElementById('content').appendChild(heading);

        document.getElementById('avatar').appendChild(image);
      });
    });
  }

popup.html：

<html>
    <head>
        <script src="js/oauth/oauth.js"></script>
        <script src="https://apis.google.com/js/client.js?onload=handleClientLoad"></script>
    </head>


<body style="width: 500px">

<div id="flows" style="display: none;" >
  <h2>Please log in before starting</h2>
    <button id="authorize-button">Log in</button>

</div>  

<div id="welcome" style="display: none;">
<div id="avatar"></div>
<div id="content"></div>

</div>


 </body>
</html>

sdlkfad

这就是它的样子： OAuth White Screen

OAuth 2.0身份验证屏幕保持打开状态

0 个答案: