javascript - 无法读取 Google Oauth 中未定义的属性 'authorize'？

Question

我正在使用 Oauth 开发 chrome 扩展，用户可以通过 Google 帐户登录。我有如下代码 jquery。

我还在 html 文件中包含了 js 库:

<script src="js/jquery-2.1.1.min.js" type="text/javascript"></script>

<script src="js/client.js"></script>  

并具有JS功能:

function handleAuthClick(event) {
gapi.auth.authorize({
    client_id: clientID,
    scope: scopes,
    response_type: 'code token id_token gsession',
    access_type: accessType,
    immediate: false
}, handleAuthResult);
return false;
}

我的问题是:我无法通过谷歌帐户登录并且显示错误:Uncaught TypeError: Cannot read property 'authorize' of undefined。

注意:如果我运行为html我可以正常登录，但是当我作为chrome扩展时我无法登录。

Answer 1

似乎 gapi.auth 仍未初始化，原因是您在进行此调用之前没有遵循正确的步骤链来设置它。 所以我只是在这里放一个示例，供您查看在成功初始化 gapi 对象时是否遗漏了任何步骤。就这样

<script type="text/javascript">
    (function( gapi ) {
        gapi.client.setApiKey(apiKey); // your variable for 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('id-of-your-login-button');
            if (authResult && !authResult.error) {
                authorizeButton.style.visibility = 'hidden';
                makeApiCall();
            } else {
                authorizeButton.style.visibility = '';
                authorizeButton.onclick = handleAuthClick;
            }
        }

      function handleAuthClick(event) {
          gapi.auth.authorize({
              client_id: clientID,
              scope: scopes,
              response_type: 'code token id_token gsession',
              access_type: accessType,
              immediate: false
          }, handleAuthResult);
          return false;
       }
     })( gapi );
</script>

您可以安全地将此脚本标记放在按钮 html 代码下方的 body 标记中。