Question

我正在尝试创建一个Chrome扩展程序，用于从Metacritic中提取和操作数据。我发现这个pretty great API在线，可以让我发送一个GET请求我需要的数据，并以JSON格式返回。但是，它似乎不能直接在JS中完成。

有没有办法在扩展程序中运行API请求？我将URL保存为JS文件中的变量并对其进行格式化，以便将所有内容插入到请求中...如果我能弄清楚它是如何工作的。

编辑：经过思考，也许解决问题的方法之一就是在扩展程序中的Javascript文件中运行一种可用语言（如Ruby）的脚本......这可能吗？

Answer 1

您可能无法从javascript访问API的主要原因是同源安全限制。

Chrome扩展程序可以请求访问指定域的权限并绕过这些限制，有关此文档的文档可在以下位置找到：https://developer.chrome.com/extensions/xhr#requesting-permission

将以下内容添加到扩展程序清单文件应该可以解决问题：

"permissions": [
    "https://byroredux-metacritic.p.mashape.com/"
],

完成后，您应该可以使用扩展程序javascript中的任何普通XHR客户端访问API（请注意任何安全问题）。 XHR最常见的API可能是jQuery方法$.ajax。

例如：

$.ajax({
    url: "https://byroredux-metacritic.p.mashape.com/find/game",
    method: "POST",
    headers: {
        "X-Mashape-Key": API_KEY
    },
    data: {
        platform: 1,
        retry: 4,
        title: "The Elder Scrolls V: Skyrim"
    },
    dataType: "json",
    success: function(data) { console.log(data) }
})

（注意：此代码均未经过测试）。

Answer 2

我还没有开发Chrome扩展程序，但据我了解，您可以随意添加任何JS。

我建议使用像这样的库：https://github.com/swagger-api/swagger-js

将其保存在您的扩展程序中，并将其添加为依赖项

"content_scripts": [
{ 
  "matches": ["..."],
  "js": ["swagger.js"]
}

然后让它运行（值得看看GitHub上的文档）：

window.swagger = new SwaggerApi({
url: "https://byroredux-metacritic.p.mashape.com/find/game",
success: function() {
  if(swagger.ready === true) {
    // Upon connection, retrieve something
    swagger.apis.title.getGameByTitle({title:'The Elder Scrolls V: Skyrim'}, function(data) {
      var game = data.content.data;
    });
  }
}
});

它还有一些东西可以指定标题，我认为你需要特定的API。

我建议＆＃34;香草＆＃34; JS库因为包含jQuery可能会过度杀伤并妨碍性能。

Answer 3

我不是Chrome扩展开发者，但这可能有所帮助 https://developer.chrome.com/extensions/xhr

以任何方式从Chrome扩展程序中的API中提取数据

3 个答案: