chrome 扩展中的跨域 XMLHttpRequest

Posted 2023-02-27

【中文标题】chrome 扩展中的跨域 XMLHttpRequest

【英文标题】：Cross-Origin XMLHttpRequest in chrome extensions

【发布时间】：2012-03-14 09:11:06

【问题描述】：

根据 chrome 扩展 API，如果设置了权限，则应允许使用 XMLHttpRequest 对象进行跨域调用：

只要首先请求跨域权限，扩展程序就可以与其源之外的远程服务器通信。

我密切关注the tutorial，但下面的代码给了我一条错误消息：

XMLHttpRequest 无法加载 http://www.google.com/search?hl=en&q=ajax。 Access-Control-Allow-Origin 不允许来源 chrome-extension://bmehmboknpnjgjbmiaoidkkjfcgiimbo。

我不仅允许向 google.com 发出请求，还允许向任何网站发出请求，但仍然无法通过。 有人可以帮忙吗？

我的清单文件：

  "name": "The popup",
  "version": "0.1",
  "popup": "popup.html",
  "permissions": [
    "http://*/*",
    "https://*/*",
    "https://www.google.com/*",
    "http://www.google.com/*"
    ],
  "browser_action": 
    "default_icon": "clock-19.png",
    "default_title": "This is title",
    "default_popup": "popup.html"
  

实际调用：

function sendRequest() 
    document.write("Sending request");
    var req = new XMLHttpRequest();
      req.open("GET", "http://www.google.com/search?hl=en&q=ajax", true);
      req.onreadystatechange = function() 
          if (req.readyState == 4) 
            if (req.status == 200) 
              alert(req.responseText);
              document.write("OK");
            
          
        ;
      req.send();
 

【问题讨论】：

遇到了类似的问题。我的问题是不在 manifest.json 中设置跨域权限。我会添加developer.chrome.com/extensions/xhr.html 供其他人查找。

【参考方案1】：

两件事；您需要确保您制作的是打包的应用程序/扩展程序，而不是托管的。跨源请求不适用于托管应用程序。假设您已确定该部分，您可能希望尝试将以下内容放入您的权限中：http://*/。这是我的一个打包应用程序中唯一的一个，它确实可以跨源，没有任何问题。

【讨论】：

宾果游戏！我正在关注的教程没有提到必须将其打包以使跨域 xmlhttprequest 正常工作的事实。我想这是我从出生就应该知道的事情。谢谢！

是的，我经历了同样的反复试验来弄明白。确实应该更新文档以反映托管应用程序和打包应用程序之间的差异，并可能澄清扩展程序是否与应用程序相同等。

什么是打包和托管扩展？

@barraponto 参考developers.google.com/chrome/web-store/articles/…

请注意，当安装需要权限的应用程序 ["http://*/"] 时，用户会收到警告“此应用程序：可以访问您在所有网站上的数据”。我的应用程序的用户现在正在使用 1 星评价来烧掉该应用程序:(。