Không thể đọc thuộc tính 'ủy quyền' không xác định trong Google Oauth?

Question

Tôi đang sử dụng Oauth để phát triển cho tiện ích chrome và người dùng có thể đăng nhập bằng Tài khoản Google. Tôi có mã jquery như bên dưới.

Tôi cũng bao gồm thư viện js trong file html:

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

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

và có JS chức năng:

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; 
} 

My vấn đề là: Tôi không thể đăng nhập bằng tài khoản google và hiển thị nó lỗi: Uncaught TypeError: Cannot read property 'authorize' of undefined.

Lưu ý: Nếu tôi chạy dưới dạng html, tôi có thể đăng nhập bình thường, nhưng tôi không thể đăng nhập khi sử dụng làm tiện ích chrome.

Answer 1

Dường như gapi.auth vẫn chưa được khởi tạo và lý do cho điều đó là bạn không thực hiện đúng chuỗi các bước để thiết lập trước khi thực hiện cuộc gọi này. Vì vậy, tôi chỉ cần đặt ở đây một mẫu để bạn có thể xem liệu bạn có thiếu bất kỳ bước nào trong khi khởi tạo đối tượng gapi thành công hay không. Ở đây nó đi

<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> 

Bạn có thể đặt thẻ script này một cách an toàn vào thẻ body ngay bên dưới mã html của nút.