使用 Google API 客户端库在 Chrome 扩展中进行 OAuth 2 身份验证

Question

我正在尝试构建一个访问 Google Drive 的 Chrome 扩展程序，其中使用 JavaScript 的 Google API 客户端库执行 OAuth 2 身份验证请求。我的扩展程序已在 Google Developers Console 中注册。

manifest.json

"background": {
    "page": "background.html"
},

背景.html

<script type="text/javascript" src="jquery-1.10.2.min.js"></script>
<script type="text/javascript" src="https://apis.google.com/js/client.js"></script>
<script type="text/javascript" src="google_auth/initiation.js"></script>

initiation.js

var CLIENT_ID = 'MY_CLIENT_ID';
var SCOPES = 'https://www.googleapis.com/auth/drive.file';

jQuery(window).load(function() {
   gapi.auth.authorize({
     client_id: CLIENT_ID,
     scope: SCOPES,
     immediate: false
  }, function(authResult) {
        if (authResult && !authResult.error) {
           window.alert('Auth was successful!');
        } else {
           window.alert('Auth was not successful');
        }
     }
   );
 });

在浏览器中加载或重新加载扩展程序时，会出现一个弹出窗口，我会收到来自 Google 的响应消息：

这是一个错误。

错误：invalid_client

应用程序：我的扩展

实际上，我想知道为我的 Chrome 扩展程序选择 Google API 客户端库是否正确，以及我的实现是否存在任何遗漏的错误。

Answer 1

我没有足够的声誉来评论，但如果你的initiation.js是逐字的。您应该将“MY_CLIENT_ID”和 CLIENT_ID 替换为您在此处向 Google 注册应用程序时收到的客户端 ID https://console.developers.google.com/

它看起来像这样：

858545004388-tlfkq1hfdbuiductlb0qdvjds4s949gt.apps.googleusercontent.com

这就是错误：invalid_client 告诉您的内容。

Answer 2

Web 身份验证协议利用 HTTP 功能，但 Chrome 应用程序 在应用程序容器内运行；它们不通过 HTTP 加载，也不能 执行重定向或设置 cookie。

使用 Google 身份https://developer.chrome.com/apps/app_identity

Answer 3

到 2023 年，google js api 客户端将适用于 chrome 扩展，使用 Gapi 的唯一方法是将整个 js 文件本身与捆绑包一起发送，因为清单 v3 上不允许使用外部脚本。您最好自己调用端点并摆脱混乱。