从Chrome扩展中的JavaScript调用网站API时出现跨域错误

我正在研究一个小的Chrome扩展，它将调用Remember the Milk API。谷歌有一个使用Flikr API的good example，我将它用作我的扩展的基础。他们的例子在我的浏览器（Linux上最新的Chrome）上完美运行。从Chrome扩展中的JavaScript调用网站API时出现跨域错误

当我换出记住牛奶API方法名称和API密钥，不过，我发现了以下错误：

XMLHttpRequest cannot load http://api.rememberthemilk.com/services/rest/?method=rtm.test.echo&api_key=xxxxxxxxxxxxxxxxxxxxxx&name=Test%20task. 
Origin chrome-extension://lifnmciajdfhj is not allowed by Access-Control-Allow-Origin.

我的代码如下所示：

var req = new XMLHttpRequest(); 
    req.open(
      "GET", 
      "http://api.rememberthemilk.com/services/rest/?" + 
      "method=rtm.test.echo&" + 
      "api_key=xxxxxxxxxxxxxxxxxxxxxxxxxx&" + 
      "name=Test%20task", 
      true); 
    req.onload = onResponseReceived; 
    req.send(null); 

    function onResponseReceived() { 
     console.log("It worked."); 
    }

任何建议？

来源

2011-12-20 Josh Earl

And ......像往常一样，在几分钟内发布在这里。问题是manifest.json文件，它最初具有Flikr API的权限。我已经更新了它们以指向记住牛奶，但显然您需要卸载并重新安装扩展才能重新注册权限。

谷歌有一个很好的教程处理XHR in extensions。

这是更新的manifest.json。也许它会对别人有帮助。

{ 
     "name": "Remember the Milk", 
     "version": "1.0", 
     "description": "A Remember the Milk extension.", 
     "browser_action": { 
      "default_icon": "rtm.png", 
      "popup": "popup.html" 
     }, 
     "permissions": [ 
      "http://*.rememberthemilk.com/", 
      "https://*.rememberthemilk.com/" 
     ] 
    }

来源

2011-12-20 03:52:52

确保其从服务器端允许头

//header("Access-Control-Allow-Origin: {$_SERVER['HTTP_ORIGIN']}"); 
// or 
header("Access-Control-Allow-Origin: *"); 
header("Access-Control-Allow-Credentials: true"); 
header('Access-Control-Allow-Methods: GET, PUT, POST, DELETE, OPTIONS'); 
header('Access-Control-Max-Age: 1000'); 
header('Access-Control-Allow-Headers: Content-Type, Content-Range, Content-Disposition, Content-Description');

而且还要检查您的域在WWW或非www redirction开。

来源

2016-03-02 11:11:06 manish1706

从Chrome扩展中的JavaScript调用网站API时出现跨域错误

回答

相关问题