Question

我正在尝试使用跨域请求。相关代码如下：

var promise = $.ajax({
    type: 'GET',
    url: registerUrl,
    dataType: 'json',
    cache: false,
    crossDomain: true,
    xhrFields: { withCredentials: true },
    contentType: 'application/json'
});

我控制了主叫和接收服务器，这是我得到的响应：

原始请求（由Fiddler提供）：

OPTIONS http://localhost:5080/mportal/registerChat?gsid=abcde&ul=100,200&_=1405022169353 HTTP/1.1
Host: localhost:5080
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:29.0) Gecko/20100101 Firefox/29.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Origin: http://localhost:53054
Access-Control-Request-Method: GET
Access-Control-Request-Headers: content-type
Connection: keep-alive

原始回复：

HTTP/1.1 200 OK
Date: Thu, 10 Jul 2014 19:56:11 GMT
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, PUT, DELETE
Content-Length: 0
Server: Jetty(8.1.4.v20120524)

现在，我的理解是，此预检的Allow-Origin: *应足以让Firefox / Chrome继续请求。奇怪的是，IE没有对此请求进行预检，并且它有效（尽管发出警告说它没有遵循CORS规范）。

我在这里遗漏了什么吗？我已经尝试在我能想到的ajax请求上设置每个值，并且服务器看起来正在响应OPTIONS请求的相应响应。

来自firefox的具体错误消息：

Cross-Origin Request Blocked: The Same Origin Policy disallows reading the remote resource at http://localhost:5080/mportal/registerChat?gsid=abcde&ul=100,200&_=1405022169353. This can be fixed by moving the resource to the same domain or enabling CORS.

我做错了什么？有什么可以修改来解决这个问题？

编辑：新请求/响应字段：

OPTIONS http://localhost:5080/mportal/registerChat?gsid=abcde&ul=100,200&_=1405026511996 HTTP/1.1
Host: localhost:5080
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:30.0) Gecko/20100101 Firefox/30.0
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Origin: http://localhost:53054
Access-Control-Request-Method: GET
Access-Control-Request-Headers: content-type
Connection: keep-alive

响应：

HTTP/1.1 200 OK
Date: Thu, 10 Jul 2014 21:08:38 GMT
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: GET, POST, PUT, DELETE
Access-Control-Allow-Headers: content-type
Access-Control-Allow-Credentials: true
Content-Length: 0
Server: Jetty(8.1.4.v20120524)

现在，fiddler还记录了实际的请求：

GET http://localhost:5080/mportal/registerChat?gsid=abcde&ul=100,200&_=1405026511996 HTTP/1.1
Host: localhost:5080
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:30.0) Gecko/20100101 Firefox/30.0
Accept: application/json, text/javascript, */*; q=0.01
Accept-Language: en-US,en;q=0.5
Accept-Encoding: gzip, deflate
Content-Type: application/json
Referer: http://localhost:53054/
Origin: http://localhost:53054
Connection: keep-alive

回复：

HTTP/1.1 200 OK
Date: Thu, 10 Jul 2014 21:08:38 GMT
Content-Type: application/json;charset=ISO-8859-1
Content-Length: 175
Server: Jetty(8.1.4.v20120524)

{"status":true,"host":"<myServerName>","port":1935,"liveHost":"<myServerName>","livePort":5080,"gsid":"abcde","connCount":2,"maxConns":25000,"version":"1.0"}

然而，firefox似乎阻止了请求，因此ajax调用总是命中我的失败处理程序。这看起来很奇怪......

Answer 1

您的请求似乎要求获得发送内容类型请求标头的权限，并且需要获得发送凭据的权限。

据我所知，您的请求标题似乎是正确的。但是，您的回复应包含两个标题：

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:content-type

以下是我工作的其他网站的预检请求示例以及预检响应：

这是预检选项请求标题

Accept:*/*
Accept-Encoding:gzip,deflate,sdch
Accept-Language:en-US,en;q=0.8
Access-Control-Request-Headers:accept, applicationname
Access-Control-Request-Method:GET
Cache-Control:no-cache
Connection:keep-alive
Cookie:*sanitized cookie data*
Host:sanitized.domain.com
Origin:https://sanitized.domain.com
Pragma:no-cache
Referer:https://sanitized.domain.com/
User-Agent:Mozilla/5.0 (Windows NT 6.1; WOW64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1916.153 Safari/537.36

随后是预检响应标题：

Access-Control-Allow-Credentials:true
Access-Control-Allow-Headers:applicationname
Access-Control-Allow-Origin:https://sanitized.domain.com
Cache-Control:no-cache
Connection:keep-alive
Content-Length:0
Date:Thu, 10 Jul 2014 20:19:25 GMT
Expires:-1
Pragma:no-cache
Server:Microsoft-IIS/8.0
X-AspNet-Version:4.0.30319
X-Powered-By:ASP.NET

请注意添加了Access-Control-Allow-Credentials和Access-Control-Allow-Headers标头。另请注意我的请求在Access-Control-Request-Headers标头中发送“accept”，并且响应不包含“accept”。这是因为“accept”被认为是这里定义的简单标题：http://www.w3.org/TR/cors/#simple-header。此外，仅当内容类型的值为以下值之一时，内容类型才有资格作为简单标题：

文本/纯
的multipart / form-data的
应用程序/ x-WWW窗体-urlencoded

在你的情况下，由于内容类型是application / json，你需要一个包含“content-type”的响应头，如上所示。

<强>更新在预检请求之后发生的请求和响应应包含相同的CORS标头，以防止浏览器拒绝请求和/或响应。您至少需要响应包含Access-Control-Allow-Credentials和Access-Control-Allow-Origin标头。

Answer 2

尝试设置

dataType:'html'

（Where is the correct place to enable CORS?）

jQuery跨域请求

2 个答案: