javascript - 从选项页面中调用 Chrome 扩展方法？

Question

我为特定网站编写了一个 Chrome 扩展。如果安装了扩展程序并且我导航到该网站“example.com”，我的扩展程序将调用以下方法:

 var search="john";
 $.get("https://www.example.com/complete/search?q="+search, function (data) {
        console.log(data);
    });

效果很好。

现在我必须从该扩展的选项页面中调用相同的方法。当我这样做时，我收到以下错误:

XMLHttpRequest cannot load https://www.example.com/complete/search?q=John. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'http://localhost' is therefore not allowed access.

我明白为什么会发生这种情况，但必须找到一种方法来解决这个问题。我的想法是触发扩展脚本调用该方法，然后将结果返回到选项页面。我希望 chrome.runtime.sendMessage() 在这里没有帮助。

不用说:该域不是由我托管的，所以我不能只更改 header 。

Answer 1

该错误表明它不是实际的选项页面:您通过本地网络服务器(来源: http://localhost/ )打开它(可能是意外)，而不是打开与扩展程序打包的页面。

1. 您需要将页面(例如 options.html)添加到扩展程序的文件夹中
2. 您需要将其添加到 list 中，例如 "options_page": "options.html" 或更好 with options_ui
3. 您需要重新加载扩展程序才能应用 list 更改
4. 您需要通过扩展程序打开它，例如通过 chrome://extensions 或扩展程序按钮的上下文菜单(如果有)