Web Api、ajax 和内容类型答案

【问题标题】：Web Api, ajax and Content TypeWeb Api、ajax 和内容类型
【发布时间】：2018-08-16 22:16:51
【问题描述】：

我想更好地了解 Net 中的 WebApi 以及如何使用 ajax 调用它的正确方法。关于我的开发环境的信息很少：我正在使用 .net 4.0 和 Visual Studio 2010 和 Jquery。

型号：

public class TestForm
{
    public string FirstName { get; set; }
}

WebApi：

public class TestpController : ApiController
{
    [HttpPost]
    public HttpResponseMessage Post(TestForm form)
    {
        string jose = "jose";
        return Request.CreateResponse(HttpStatusCode.OK, "yay");
    }
}

客户端：

V1 （不起作用，返回错误 405）：

$.ajax({
    url: "http://xxx/api/Testp",
    type: "POST",                   
    data: JSON.stringify({ FirstName: "Jose" }),                
    dataType: 'json',
    contentType: "application/json; charset=utf-8",                                 
    success: function(data) {
        console.log("success");
    },
    error: function (xhr, errorType, exception) {
        console.log("error");
    }
});

V2 （有效）：

$.ajax({
    url: "http://xxx/api/Testp",
    type: "POST",                   
    data: { FirstName: "Jose" },                
    dataType: 'json',
    success: function(data) {
        console.log("success");
    },
    error: function (xhr, errorType, exception) {
        console.log("error");
    }
});

为什么我在添加contentType: "application/json; charset=utf-8" 并将数据更改为JSON.stringify({ FirstName: "Jose" }) 时出现错误，但是当我删除内容类型并在数据选项中发送对象时它可以工作。

【问题讨论】：

标签： c# ajax visual-studio-2010 asp.net-web-api .net-4.0

【解决方案1】：

您遇到的问题似乎是 jQuery 预检。

如果您查看请求的标头，您会发现在 V1 中使用的 Http 方法实际上是 OPTIONS。这是因为 jQuery 只允许 Content-Type Header 的某些值。

@McBoman 在链接源中对此进行了很好的概述。您可能还想阅读跨域资源共享 (Cors)，例如 this。

您需要添加一个函数来回答[HttpOptions]，并明确告诉预检请求允许某个“自定义”标头，或者在跨域请求的情况下允许原始域。您需要根据您的需要调整以下功能，获取预检提供的信息。

[HttpOptions]
public HttpResponseMessage Options() {

    var response = request.CreateResponse(HttpStatusCode.OK);
    response.Headers.Add("access-control-allow-origin", "*");
    response.Headers.Add("access-control-allow-headers", "content-type");
    return response;

}

希望对你有所帮助。

【讨论】：

【解决方案2】：

简短的答案在于这些警报的输出：

alert(JSON.stringify({FirstName :"Jose"}));
alert({FirstName :"Jose"});

第一个给你一个字符串，第二个给你一个对象。

你的方法：

public HttpResponseMessage Post(TestForm form)

接受一个对象而不是一个字符串。因此，当您发布字符串时，.NET Framework 无法找到可以处理字符串的方法，因此返回 405。

【讨论】：