Chrome 跨域补丁请求不起作用

Question

我有一个带有 REST Api 的网站，现在我正在创建一个浏览器扩展程序，它将从一些页面收集数据并将它们发送回 REST Api。因为我希望我的扩展与 firefox 和 chrome 兼容，并且易于维护，所以我将实际代码作为脚本标记注入页面，然后像普通 javascript 一样执行。 我目前只使用 chrome 版本的扩展程序，但遇到了问题：

当我尝试将数据发送到 api（PATCH 请求）时，chrome 不会让我说：

XMLHttpRequest 无法加载 http://my.rest/api。 Access-Control-Allow-Origin 不允许来源http://website.com。

我将 Access-Control-Allow-Headers、Methods 和 Origin 都设置为正确的值，但它仍然不起作用。但它适用于 GET 请求。我也尝试过 POST 和 PUT 请求，但它们也不起作用。

这是我的标题：

请求：

OPTIONS /some/api/path HTTP/1.1
Host: my.rest
Connection: keep-alive
Access-Control-Request-Method: PATCH
Origin: http://website.com
User-Agent: Mozilla/5.0 (Windows NT 6.2; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/27.0.1453.116 Safari/537.36
X-FireLogger: 1.1
Access-Control-Request-Headers: accept, x-http-auth-user, x-http-auth-token, origin, content-type
Accept: */*
Referer: http://website.com/index.php
Accept-Encoding: gzip,deflate,sdch
Accept-Language: cs-CZ,cs;q=0.8

回复：

Access-Control-Allow-Headers:accept, x-http-auth-user, x-http-auth-token, origin, content-type
Access-Control-Allow-Methods:PATCH
Access-Control-Allow-Origin:*
Connection:Keep-Alive
Content-Type:text/html; charset=utf-8
Date:Thu, 04 Jul 2013 10:50:08 GMT
Keep-Alive:timeout=5, max=100
Server:Apache/2.4.2 (Win64) PHP/5.4.3
X-Frame-Options:SAMEORIGIN
X-Powered-By:Nette Framework

我也尝试将 Access-Control-Allow-Origin 设置为与 Origin 标头完全相同的值，但它不起作用。此外，它似乎在 Firefox 中工作。我有 Chrome 27，应该是最新的。

Answer 1

我知道这是一篇旧帖子，但我偶然发现了同样的问题。为我解决这个问题的事情是在我在后端设置 cors 之前卸载我在 chrome 中允许 cors 的扩展。可以在此处找到扩展名：https://chrome.google.com/webstore/detail/allow-cors-access-control/lhobafahddgcelffkeicbaginigeejlf?hl=en。因此，请确保您在 chrome 中没有任何可能搞砸的扩展。

Answer 2

我在使用 CORS 的 node.js 中遇到了类似的问题

您需要将Access-Control-Allow-Origin 设置为特定域而不是通配符。

示例：Access-Control-Allow-Origin 到 http://website.com

（您可以在您的服务器上拥有一组允许的来源并检查 如果允许，则反对该请求，然后用该请求回答 通配符。）

此外，您可以将 Access-Control-Allow-Methods 标头设置为以下选项列表：

POST, GET, OPTIONS, DELETE, PUT

Answer 3

为什么不直接使用PUT 而不是PATCH 和您的请求类型。他们几乎做同样的事情

Answer 4

在您的 WebApi 中：

添加 Microsoft.AspNet.WebApi.Cors NuGet 包到项目

确保您还在全局、控制器或操作中注册 CORS 支持。

全球 - 在 App_Start 文件夹中的 WebApiConfig.cs 文件中添加：

public static void Register(HttpConfiguration config) {

// New code: var cors = new EnableCorsAttribute( origins: "*", headers: "*", methods: "*"); config.EnableCors(cors);

// Other configurations

}

Controller 或 Action - 如果需要/需要在这些级别提供支持（此将覆盖全局设置 - 操作 > 控制器 > 配置）。以上控制器或动作签名：

[EnableCors(origins: "http://localhost:[*port #*]", headers: "*", methods: "*")]

注意： * 是“通配符”，可能要放入发出请求的域 ex:(http://localhost:[port #] )

一些很容易错过/忘记的东西......

在解决方案资源管理器中，右键单击 api-project。在属性窗口中将“匿名身份验证”设置为启用！！！

Answer 5

我在 Chrome 27.0.1453.116 上尝试了 CORS，它对我有用。 在客户端，我所做的只是在 jquery AJAX 中将 'crossDomain' 设置为 true。

$.ajax('http://localhost/Elements.Services/Elements.svc/REST/Element/Get?ID=1', {
                    type: 'GET',
                    crossDomain: true,
                    success: function (data) {
                      alert(data);
                    }
                });

在 REST 服务端为每个请求设置以下响应标头：

1. （“访问控制允许标头”，“接受”） 要么 ("Access-Control-Allow-Headers", HTTPRequest.RequestedHeaders + "Accept")

2. ("Access-Control-Allow-Methods", "POST,PUT,GET")

3. ("Access-Control-Allow-Origin", "*")

Here 是关于 CORS 工作的好文章，对我很有帮助。

Answer 6

您应该在响应标头中允许 OPTIONS..

“访问控制允许方法”、“GET、POST、HEAD、OPTIONS、PUT、DELETE”