无法在JQuery 1.6.4中使用CORS进行PUT / POST / DELETE HTTP调用 [英] Unable to make PUT/POST/DELETE HTTP Call using CORS in JQuery 1.6.4

问题描述

所以，我可以使用CORS成功地对我的服务进行GET调用。但是，在POST，PUT和DELETE操作的预检级别上必须出错。但是，据我所知，我的服务器返回以响应OPTIONS查询的标头响应是正确的，并且与

So, I can successfully make a GET call to my service using CORS. However, something must be going wrong at the preflight level for the POST, PUT, and DELETE operations. However, from what I can tell, the header responses my server is returning in response to the OPTIONS query are correct and match those described in

中描述的那些匹配。这是我的javascript代码，使用JQuery 1.6.4中的$ .ajax。

Here is my javascript code, using $.ajax in JQuery 1.6.4.

$.ajax({
  url: 'http://myhome:8080/TaskApproval/resources/tasks/2',
  context: this,
  data: '<?xml version="1.0" encoding="UTF-8"?> <task> <description>Get carrots from the grocery store</description><originator>Chris</originator><subject>Get Carrots !!</subject><taskId>2</taskId> </task> ',
  timeout: 30000,
  type: 'PUT',
  contentType: 'application/xml',
  success: function(response) {
    alert(response);
    result = response;
  },
  error: function(xhr) {
    alert('Error!  Status = ' + xhr.status + " Message = " + xhr.statusText);
  }
});

现在，这就是我的HTTP Trail的样子，由Firebug提供。

Now, this is what my HTTP Trail looks like, courtesy of Firebug.

请求：

OPTIONS /TaskApproval/resources/tasks/2 HTTP/1.1
Host: widgethome:8080
User-Agent: Mozilla/5.0 (Windows NT 5.1; rv:6.0.2) Gecko/20100101 Firefox/6.0.2
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
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection: keep-alive
Origin: http://localhost:8080
Access-Control-Request-Method: PUT
Access-Control-Request-Headers: content-type

回复：

HTTP/1.1 200 OK
X-Powered-By: Servlet/3.0
Server: GlassFish v3
Allow: OPTIONS,GET,DELETE,HEAD,PUT, POST
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE
Access-Control-Max-Age: 1000
Access-Control-Allow-Headers: *
Content-Type: application/xml
Content-Length: 2792
Date: Wed, 28 Sep 2011 18:21:11 GMT

然后没有PUT（或POST）或DELETE），我只是得到那个看起来很烦人的非有用的xhr对象：

There is then no PUT (or POST or DELETE), I just get that annoying non-helpful xhr object that looks like this:

readyState  0 
responseText    ""
status  0
statusText  "error"

我很神秘如果我然后在我的Ajax调用中删除了contentType，并且它为我的应用程序发送了无效的内容类型，那么浏览器实际上发送了我的PUT请求，该请求失败，因为Content-Type不是application / xml。见下文：

I'm very mystified that if I then remove the contentType in my Ajax call, and it sends an invalid content type per my application, the browser actually sends my PUT request, which fails because the Content-Type is not application/xml. See below:

$.ajax({
  url: 'http://myhome:8080/TaskApproval/resources/tasks/2',
  data: '<?xml version="1.0" encoding="UTF-8"?> <task> <description>Get carrots from the grocery store</description><originator>Chris</originator><subject>Get Carrots !!</subject><taskId>2</taskId> </task> ',
  timeout: 30000,
  type: 'PUT',
  //contentType: 'application/xml',
  success: function(response) {
    alert(response);
    result = response;
  },
  error: function(xhr) {
    alert('Error!  Status = ' + xhr.status + " Message = " + xhr.statusText);
  }
});

导致此HTTP Trail，再次由Firebug提供：

Leads to this HTTP Trail, again courtesy of Firebug:

选项请求：

OPTIONS /TaskApproval/resources/tasks/2 HTTP/1.1
Host: myhome:8080
User-Agent: Mozilla/5.0 (Windows NT 5.1; rv:6.0.2) Gecko/20100101 Firefox/6.0.2
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
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection: keep-alive
Origin: http://localhost:8080
Access-Control-Request-Method: PUT

期权回复：

HTTP/1.1 200 OK
X-Powered-By: Servlet/3.0
Server: GlassFish v3
Allow: OPTIONS,GET,DELETE,HEAD,PUT, POST
Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE
Access-Control-Max-Age: 1000
Access-Control-Allow-Headers: *
Content-Type: application/xml
Content-Length: 2792
Date: Wed, 28 Sep 2011 18:26:23 GMT

卖出请求：

PUT /TaskApproval/resources/tasks/2 HTTP/1.1
Host: myhome:8080
User-Agent: Mozilla/5.0 (Windows NT 5.1; rv:6.0.2) Gecko/20100101 Firefox/6.0.2
Accept: */*
Accept-Language: en-us,en;q=0.5
Accept-Encoding: gzip, deflate
Accept-Charset: ISO-8859-1,utf-8;q=0.7,*;q=0.7
Connection: keep-alive
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Referer: http://localhost:8080/TaskApproval/crossdomain.html
Content-Length: 197
Origin: http://localhost:8080

卖出回应：

HTTP/1.1 415 Unsupported Media Type
X-Powered-By: Servlet/3.0
Server: GlassFish v3
Content-Type: text/html
Content-Length: 1069
Date: Wed, 28 Sep 2011 18:26:23 GMT

415有意义因为我不支持内容application / x-www-form-urlencoded，只支持application / xml。我不明白为什么设置内容类型正确地阻止了PUT？

The 415 makes sense because I don't support content application/x-www-form-urlencoded, only application/xml. What I don't understand is why does setting the Content-Type correctly prevent the PUT?

感谢您的任何见解！我已经在网上搜索了一段时间，但找不到解决这个问题的方法。

Thanks for any insight! I've been searching the internet for quite some time, and can't find a solution for this problem.

推荐答案

您需要在预检和实际响应中包含CORS标头。因此，请尝试在服务器的PUT响应中包含以下标题：

You need to include CORS headers in both the preflight and the actual response. So try including the following headers in the PUT response from your server:

Access-Control-Allow-Origin: *
Access-Control-Allow-Methods: POST, GET, OPTIONS, PUT, DELETE
Access-Control-Allow-Headers: Content-Type

另外需要注意的是，CORS规范没有将'*'列为Access-Control-Allow-Headers的有效值：

One other thing to note is that the CORS spec does not list '*' as a valid value for Access-Control-Allow-Headers:

http：// www。 w3.org/TR/cors/#access-control-allow-headers-response-he

相反，您应该尝试明确列出所有请求标头像这样：

Instead, you should try explicitly listing all the request headers like so:

Access-Control-Allow-Headers: Content-Type

您必须包含Content-Type，因为当Content-Type的值不是application / x-www-form-urlencoded，multipart时，它不被视为简单标题/ form-data，或text / plain（有关详细信息，请参阅CORS规范ls on simple headers）。

You must include Content-Type because the Content-Type is not considered a simple header when its value is not application/x-www-form-urlencoded, multipart/form-data, or text/plain (See the CORS spec for more details on simple headers).

这篇关于无法在JQuery 1.6.4中使用CORS进行PUT / POST / DELETE HTTP调用的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！