如何在浏览器中获取 Google Cloud Translation API 的身份验证令牌（chrome 扩展）

Posted 2023-02-24

【中文标题】如何在浏览器中获取 Google Cloud Translation API 的身份验证令牌（chrome 扩展）

【英文标题】：How to get an authentication token for Google Cloud Translation API within browser (chrome extension)

【发布时间】：2019-01-25 01:31:43

【问题描述】：

我正在尝试制作一个使用 Google Cloud Translation API 的 Chrome 扩展程序。我在 Google Translate 和 developing Chrome extensions 的文档中的许多不同页面上遵循了一堆说明，但我仍然无法弄清楚如何在浏览器中实际使用 API。

我得到的最远距离是从 Quickstart guide 的一部分创建服务帐户，获取服务帐户密钥文件（下载为 .json 文件），安装和初始化 Google SDK，设置 @ 987654325@环境变量到服务账户JSON密钥文件的路径，然后使用gcloud auth application-default print-access-token发出curl请求，获取访问令牌作为请求头的一部分输入：“授权：承载（令牌在这里） ”。以这种方式成功检索到翻译。

但是在扩展的环境中，你不能运行像gcloud 这样的命令，所以这不起作用。我能够使用gcloud 命令手动检索访问令牌，然后将其粘贴到我的javascript 代码中作为请求标头的一部分（例如xmlHttpRequest.setRequestHeader('Authorization', 'Bearer ya29.c.Elr6BRuTfOtherRandomLetters');）。但该访问令牌会在 60 分钟后过期，因此无法持续发挥作用。

我也尝试过使用identity.getAuthToken 方法（在按照文档说明的方式更新manifest.json 中的内容之后），但这不起作用。使用我的服务帐户客户端 ID 作为manifest.json 中oauth2 下的client_id 会导致来自identity.getAuthToken 的“无效客户端 ID”错误。另一方面，从 Google 控制台生成 OAuth2 客户端 ID，并使用 myoauth2clientid.apps.googleusercontent.com 作为 oauth2 下的 client_id 和 ["https://www.googleapis.com/auth/cloud-translation", "https://www.googleapis.com/auth/cloud-platform"] 作为 scopes 在 oauth2 下的 scopes 导致“OAuth2 未授予或撤销" 来自identity.getAuthToken 的错误。

从 Google 控制台页面生成 API 密钥，并直接将其用作我的翻译查询的 key 参数，甚至都不起作用：我收到“请求缺少有效的 API 密钥”。错误。

我在这里真的很茫然。任何帮助都会很棒。

【参考方案1】：

我经历了和你一样的步骤，也不能依赖 gcloud 进行身份验证。

让我超越“请求缺少有效的 API 密钥”错误的是使用此处描述的查询语法https://codelabs.developers.google.com/codelabs/cloud-translation-intro/index.html#5

就我而言，我使用的是：

curl -s -X POST -H "Content-Type: application/json" \
    --data "
  'q': 'The Great Pyramid of Giza (also known as the Pyramid of Khufu or the
        Pyramid of Cheops) is the oldest and largest of the three pyramids in
        the Giza pyramid complex.',
  'source': 'en',
  'target': 'es',
  'format': 'text'
" "https://translation.googleapis.com/language/translate/v2?key=YOURVALIDAPIKEYHERE"

【参考方案2】：

我（第一次发帖者）也经历了与您相同的步骤，但在 @magicnumber 的回答的帮助下，我想出了一个解决方案，使用 APIkey 而不是在我的 Chrome 扩展程序中翻译文本（从任何语言到英语）服务帐户密钥文件。

首先创建一个翻译函数（我在这里使用了 Async -> Await 模式）：

 async function translate(strSourceText,strApiKey)
  
    var url = `https://translation.googleapis.com/language/translate/v2?key=$strApiKey`
    let response = await fetch(url, 
      method: 'POST',
      headers :  
        'Content-Type': 'application/json',
       ,
       body: JSON.stringify(
         target: "en",
         format: "text",
         q: strSourceText
       ),
    ); 
    let data = await response.json()
    return data;
  

然后调用 async 函数，该函数将返回一个 Promise 例如：

query="כלב" //Hebrew word for dog ?

translate(query,  "YOURVALIDAPIKEYGOESHERE")
  .then(response => console.log(response.data))
  .catch(reason => console.log(reason.message));

来自 Google Translation API 的响应应如下所示：

  "data": 
    "translations": [
      
        "translatedText": "Dog",
        "detectedSourceLanguage": "iw"
      
    ]
  

最后，为了避免违反内容安全政策，在我的例子中，我必须将翻译 API 域添加到我的扩展程序 manifest.json 文件中的权限键中：

"permissions": ["https://translation.googleapis.com/language/translate/v2/*"],

【讨论】：

您的解决方案不适用于我在 Cloud Console 中为新创建的项目创建的 API 密钥。我启用了一个有试用期的付费帐户，但它仍然拒绝工作。我的错在哪里？