当我有这个代码时

$.ajax({
    type: 'POST',
    //contentType: "application/json",
    url: 'http://localhost:16329/Hello',
    data: { name: 'norm' },
    dataType: 'json'
});

在 Fiddler 中我可以看到以下原始请求

POST http://localhost:16329/Hello HTTP/1.1
Host: localhost:16329
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:10.0.2) Gecko/20100101 Firefox/10.0.2
Accept: application/json, text/javascript, */*; q=0.01
Accept-Language: ru-ru,ru;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
Content-Type: application/x-www-form-urlencoded; charset=UTF-8
Referer: http://localhost:14693/WebSite1/index.html
Content-Length: 9
Origin: http://localhost:14693
Pragma: no-cache
Cache-Control: no-cache

name=norm

但我正在尝试将内容类型从 application/x-www-form-urlencoded 设置为 application/json。但是这段代码

$.ajax({
    type: "POST",
    contentType: "application/json",
    url: 'http://localhost:16329/Hello',
    data: { name: 'norm' },
    dataType: "json"
});

产生奇怪的请求(我可以在 Fiddler 中看到)

OPTIONS http://localhost:16329/Hello HTTP/1.1
Host: localhost:16329
User-Agent: Mozilla/5.0 (Windows NT 6.1; WOW64; rv:10.0.2) Gecko/20100101 Firefox/10.0.2
Accept: text/html,application/xhtml+xml,application/xml;q=0.9,*/*;q=0.8
Accept-Language: ru-ru,ru;q=0.8,en-us;q=0.5,en;q=0.3
Accept-Encoding: gzip, deflate
Connection: keep-alive
Origin: http://localhost:14693
Access-Control-Request-Method: POST
Access-Control-Request-Headers: content-type
Pragma: no-cache
Cache-Control: no-cache

这是为什么呢？应该在那里发布的选项是什么？我的内容类型在哪里设置为 application/json？并且请求参数由于某种原因消失了。

更新 1

在服务器端，我有非常简单的 RESTful 服务。

[AspNetCompatibilityRequirements(RequirementsMode = AspNetCompatibilityRequirementsMode.Allowed)]
public class RestfulService : IRestfulService
{
    [WebInvoke(
        Method = "POST",
        UriTemplate = "Hello",
        ResponseFormat = WebMessageFormat.Json)]
    public string HelloWorld(string name)
    {
        return "hello, " + name;
    }
}

但由于某种原因，我无法使用参数调用此方法。

更新 2

抱歉这么久没有回复。

我已将这些 header 添加到我的服务器响应中

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

它没有帮助，我有 Method not allowed 来自服务器的错误。

这是我的 fiddler 说的

所以，现在我可以确定我的服务器接受 POST、GET、OPTIONS(如果响应 header 像我预期的那样工作)。但是为什么“方法不允许”？

在来自服务器的 WebView 响应中(您可以在上图中看到 Raw 响应)看起来像这样

最佳答案

似乎从 URL 选项中删除 http:// 可以确保发送正确的 HTTP POST header 。

我认为您不需要完全限定主机的名称，只需使用下面的相对 URL。

   $.ajax({
      type: "POST",
      contentType: "application/json",
      url: '/Hello',
      data: { name: 'norm' },
      dataType: "json"
   });

我的一个例子:

        $.ajax({
            type: "POST",
            url: siteRoot + "api/SpaceGame/AddPlayer",
            async: false,
            data: JSON.stringify({ Name: playersShip.name, Credits: playersShip.credits }),
            contentType: "application/json",
            complete: function (data) {
            console.log(data);
            wait = false;
        }
    });

可能相关: jQuery $.ajax(), $.post sending "OPTIONS" as REQUEST_METHOD in Firefox

经过更多研究后，我发现 OPTIONS header 用于确定是否允许来自原始域的请求。使用 fiddler，我将以下内容添加到服务器的响应 header 中。

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

一旦浏览器收到此响应，它就会发送带有 JSON 数据的正确 POST 请求。似乎默认的 form-urlencoded 内容类型被认为是安全的，因此不会进行额外的跨域检查。

您似乎需要将前面提到的 header 添加到您的服务器对 OPTIONS 请求的响应中。您当然应该将它们配置为允许来自特定域而不是所有域的请求。

我使用下面的 jQuery 进行了测试。

$.ajax({
   type: "POST",
   url: "http://myDomain.example/path/AddPlayer",
   data: JSON.stringify({
      Name: "Test",
       Credits: 0
   }),
   //contentType: "application/json",
   dataType: 'json',
   complete: function(data) {
       $("content").html(data);
  }
});​

引用资料:

• http://www.w3.org/Protocols/rfc2616/rfc2616-sec9.html
• http://enable-cors.org/
• https://developer.mozilla.org/en/http_access_control

关于json - 无法在 jQuery.ajax 中将内容类型设置为 'application/json'，我们在Stack Overflow上找到一个类似的问题： https://stackoverflow.com/questions/9754767/