Question

我是Chrome扩展程序开发的新手，我正在开发Chrome 开发人员扩展程序（显示为开发人员工具的一部分）。此要求是进行外部服务（某些URL）调用，该调用可能在同一服务器（原始服务器）中，也可能不在同一服务器中。从文档中我看到扩展不受同源策略的限制。 https://developer.chrome.com/extensions/xhr

但是当我尝试呼叫外部服务时，我遇到了CORS问题。

Manifest.json看起来像下面的那个，我有权访问所有网站。

"permissions": [
        "tabs",
        "clipboardWrite",
        "http://*/*",
        "https://*/*"
    ],

在我尝试在某些URL上调用HTTP POST的代码中，代码看起来像

gwUrl = 'http://services.odata.org/V2/(S(lts2i32bwwy01zoq4cxyscwt))/OData/OData.svc/Products';
var xhr = new XMLHttpRequest();
xhr.open("POST", gwUrl , true);
xhr.setRequestHeader("Content-type", "application/json");
xhr.onreadystatechange = function() {}
xhr.send({ "ID":17, "Name": "Bread", "Description": "Whole grain bread"});

我收到以下错误。

选项http // services.odata.org / V2 /（S（lts2i32bwwy01zoq4cxyscwt））/ OData / OData.svc / Products 501（未实施）

XMLHttpRequest无法加载http // services.odata.org / V2 /（S（lts2i32bwwy01zoq4cxyscwt））/ OData / OData.svc / Products。对预检请求的响应未通过访问控制检查：请求的资源上不存在“Access-Control-Allow-Origin”标头。因此，不允许访问“chrome-extension：// cdcbiglainpfeapfejdjdkldcehjakfi”。响应的HTTP状态代码为501。

Error Screenshot 任何人都可以指导我解决问题。

Answer 1

您可能想尝试添加Access-Control-Allow-Origin标头。响应标头指示响应是否可以与具有给定源的资源共享。

您可能还想查看Using CORS教程以便更好地理解。本教程提到需要在所有有效的CORS响应中包含Access-Control-Allow-Origin标头并省略标头将导致CORS请求失败。

以下SO帖子中给出的解决方案也可能有所帮助：

Error in Chrome only: XMLHttpRequest cannot load file URL No 'Access-Control-Allow-Origin' header is present on the requested resource
XmlHttpRequest error: Origin null is not allowed by Access-Control-Allow-Origin
How does Access-Control-Allow-Origin header work?

Chrome Developer Extension

1 个答案: