jQuery $.ajax() 方法在使用 Web API 时没有正确设置 contentType答案

【问题标题】：jQuery $.ajax() method is not setting contentType correctly when using Web APIjQuery $.ajax() 方法在使用 Web API 时没有正确设置 contentType
【发布时间】：2023-03-07 20:08:01
【问题描述】：

我正在尝试使用 jQuery 的 $.ajax() 方法将以下对象发送到我的 Web API Rest 服务。当我在没有明确设置内容类型的情况下进行调用时，它会自动将其设置为 application/x-www-form-urlencoded，并且响应为 500。我需要它是 application/json。当我将其设置为 contentType: 'application/json' 时，标头中的请求方法突然在开发工具中显示 OPTIONS 并且请求返回 405。有人看到我在这里做错了什么吗？我通常从来没有遇到过这样的请求。

这是我要发送的数据对象。

var TEST_DATA = {
        PaitentId: "323f0725-b404-4ab3-b227-e64b090ff62f",
        PracticeId: "2387B1BE-6CEC-41C1-B411-687BD6160556",
        ReportName: "SOME_REPORT_NAME",
        DeviceId: 1,
        GlucoseUnits: 1,
        HighGlucoseThreshold: 185,
        LowGlucoseThreshold: 80,
        TodayDate: "\/Date(1382932800000)\/",
        StartDate: "\/Date(1357016400000)\/",
        EndDate: "\/Date(1411876800000)\/"
}

这是我对 api 的调用

var GenerateReport = function () {
    $.ajax({
        type: 'POST',
        url: SERVICE_URL,
        processData: false,            
        dataType: 'json',
        contentType: 'application/json',
        data: TEST_DATA,
        crossDomain: true,
        beforeSend: displaySpinner(),

        success: function (data) {
            successCallback(data);
        },

        error: function () {
            errorCallback();
        }
    });

}

编辑：这最终是我可以通过 Web API 解决的问题，答案如下。

【问题讨论】：

标签： javascript jquery web-services

【解决方案1】：

如果您尝试执行跨域请求，这是设计使然。 jQuery.ajax 的文档说：注意：对于跨域请求，将内容类型设置为 application/x-www-form-urlencoded、multipart/form-data 或 text/plain 以外的任何内容都会触发浏览器向服务器发送预检 OPTIONS 请求。

您不应该将 Json 用于跨域 Web 服务。

【讨论】：

嗯，你是对的，看起来 JSONP 是需要使用的。

【解决方案2】：

所以我最终解决了这个问题，允许直接通过 Web API 使用 CORS。文档可以在这里找到http://www.asp.net/web-api/overview/security/enabling-cross-origin-requests-in-web-api

您将 config.EnableCors(); 添加到您的 WebApiConfig 类中。然后在您的控制器中，您可以添加如下属性

    namespace WebService.Controllers
    {
        [EnableCors(origins: "http://your.origin.site.com", headers: "*", methods: "*")]
        public class TestController : ApiController
        {
            // Controller methods not shown...
        }

     }

您也可以通过WebApiConfig 全局执行此操作。

【讨论】：