如何将 GAPI 集成到 Chrome 扩展清单 v3 中?

thd*_*oan 7 google-chrome-extension google-api-js-client

我有一个 Chrome Manifest v2 扩展程序,可以通过 Google API 与 Google Sheets 进行交互。相关代码:

清单.json

"content_security_policy": "script-src 'self' https://apis.google.com/; object-src 'self'",
Run Code Online (Sandbox Code Playgroud)

背景.html

<script src="https://apis.google.com/js/client.js?onload=onGAPILoad"></script>
Run Code Online (Sandbox Code Playgroud)

Manifest v3 禁止远程托管脚本(请参阅此处此处),那么你们是如何绕过此限制的呢?

更新:我已经提交了一张票,至少让 Chromium 团队意识到 MV3 中这一新安全限制所带来的影响:

https://bugs.chromium.org/p/chromium/issues/detail?id=1164452

如果您的扩展程序遇到同样的问题,请前往那里对此票进行投票。我们希望在 Manifest v2 被弃用之前找到一个可行的解决方案。

Ext*_*ter 3

我在与 google 文档交互时遇到了类似的问题,使用它我可以成功地从我的 chrome 扩展(清单 v3)创建和编辑文档。您可以使用chrome.identityAPI​​进行登录。然后使用fetchrequest 调用 Sheets API / Docs API。

按照minni minhaj 的回答使用 chrome.identity 获取 oAuthToken。将令牌存储在您的background.js. 从云控制台为您的 Google 云项目启用 Sheets API。

在您的中添加所需的范围manifest.json

"oauth2": {
    "client_id": "{client_id}.apps.googleusercontent.com",
    "scopes": [
        ""
    ]
}
Run Code Online (Sandbox Code Playgroud)

请参阅表 oAuth2 范围以选择适当的范围。

现在您可以从 中对工作表 API进行 fetch 调用background.js。这是在用户驱动器中创建新电子表格的调用 -

const data = {
    "title": `SheetsTitle`
}

fetch('https://sheets.googleapis.com/v4/spreadsheets', {
    method: 'POST',
    headers: {
        'Content-Type': 'application/json',
        'Authorization': `Bearer ${oAuthToken}`
    },
    body: JSON.stringify(data)
}).then((document) => {
    return document.json();
}).then((document) => {
    console.log("Document Created......", document);
    docId = document.documentId;
    console.log(docId);
}).catch((error) => {
    console.log("error");
})
Run Code Online (Sandbox Code Playgroud)