Jquery - 如何使$.post()使用contentType=application/json？

Question

Jquery - 如何使$.post()使用contentType=application/json？

354

我注意到在使用jquery的$.post()时，默认的contentType是application/x-www-form-urlencoded，但我的asp.net mvc代码需要有contentType=application/json（参见此问题以了解为什么必须使用application/json：ASPNET MVC - Why is ModelState.IsValid false "The x field is required" when that field does have a value?）。我该如何使$.post()发送contentType=application/json？我已经有大量的$.post()函数，所以不想改用$.ajax()，因为这需要太多时间。如果我尝试

$.post(url, data, function(), "json")

我仍然拥有contentType=application/x-www-form-urlencoded。那么，如果“json”参数不能将contenttype更改为json，它到底是做什么的？

如果我尝试

$.ajaxSetup({
  contentType: "application/json; charset=utf-8"
});

那样做可以起作用，但会影响我所有的$.get和$.post请求，并导致一些请求出错。那么有没有办法改变$.post()的行为，使其发送contentType=application/json？

- JK.

17个回答

网页内容由stack overflow 提供, 点击上面的

可以查看英文原文，
原文链接

- Ben Creasy · Answer 1

目前的文档显示，从3.0开始，$.post将接受设置对象，这意味着您可以使用$.ajax选项。 3.0尚未发布，在提交中他们正在讨论隐藏它在文档中的引用，但请期待未来的更新！

- Oleg Burov · Answer 2

我曾遇到以下JavaScript代码的类似问题：

var url = 'http://my-host-name.com/api/Rating';

var rating = { 
  value: 5,
  maxValue: 10
};

$.post(url, JSON.stringify(rating), showSavedNotification);

在 Fiddler 中，我该如何查看具有以下内容的请求：

头部信息：Content-Type: application/x-www-form-urlencoded; charset=UTF-8
正文信息：{"value":"5","maxValue":"5"}

因此，我的服务器无法将对象映射到服务器端类型。

将最后一行更改为以下内容后：

$.post(url, rating, showSavedNotification);

在Fiddler中，我仍然可以看到：

头部：Content-Type: application/x-www-form-urlencoded; charset=UTF-8
正文：value=5&maxValue=10

然而，服务器开始返回我所期望的内容。

- Johannes · Answer 3

由于某些原因，在我的情况下，按照 @Adrien 的建议设置ajax请求的内容类型并没有起作用。不过，您实际上可以在执行$.post之前通过以下方法更改内容类型：

$.ajaxSetup({
    'beforeSend' : function(xhr) {
        xhr.overrideMimeType('application/json; charset=utf-8');
    },
});

然后进行您的$.post调用：

$.post(url, data, function(), "json")

我在使用jQuery + IIS时遇到了问题，这是唯一一个能帮助jQuery理解使用windows-1252编码进行ajax请求的解决方案。

- Snziv Gupta · Answer 4

我们可以在 $.post 中像这样更改 Content-type。

$.post(url,data, function (data, status, xhr) {
    xhr.setRequestHeader("Content-type", "application/x-www-form-urlencoded; charset=utf-8");});

- Blackening · Answer 5

你自己的适配器/包装器怎么样？

//adapter.js
var adapter = (function() {

return {

    post: function (url, params) {
        adapter.ajax(url, "post", params);
        },
    get: function (url, params) {
        adapter.ajax(url, "get", params);
    },
    put: function (url, params) {
        adapter.ajax(url, "put", params);
    },
    delete: function (url, params) {
        adapter.ajax(url, "delete", params);
    },
    ajax: function (url, type, params) {
        var ajaxOptions = {
            type: type.toUpperCase(),
            url: url,
            success: function (data, status) {
                var msgType = "";
                // checkStatus here if you haven't include data.success = true in your
                // response object
                if ((params.checkStatus && status) || 
                   (data.success && data.success == true)) {
                            msgType = "success";
                            params.onSuccess && params.onSuccess(data);
                    } else {
                            msgType = "danger";
                            params.onError && params.onError(data);
                    }
            },
            error: function (xhr) {
                    params.onXHRError && params.onXHRError();
                    //api.showNotificationWindow(xhr.statusText, "danger");
            }
        };
        if (params.data) ajaxOptions.data = params.data;
        if (api.isJSON(params.data)) {
            ajaxOptions.contentType = "application/json; charset=utf-8";
            ajaxOptions.dataType = "json";
        }
        $.ajax($.extend(ajaxOptions, params.options));
    }
})();

    //api.js
var api = {
  return {
    isJSON: function (json) {
        try {
            var o = JSON.parse(json);
            if (o && typeof o === "object" && o !== null) return true;
        } catch (e) {}
        return false;
    }
  }
})();

极其简单的用法：

adapter.post("where/to/go", {
    data: JSON.stringify(params),
    onSuccess: function (data) {
        //on success response...
    }
    //, onError: function(data) {  //on error response... }
    //, onXHRError: function(xhr) {  //on XHR error response... }
});

- Soma Sarkar · Answer 6

$.post在出现CORS（跨源资源共享）问题时无法使用。请尝试使用以下格式的$.ajax：

$.ajax({
        url: someurl,
        contentType: 'application/json',
        data: requestInJSONFormat,
        headers: { 'Access-Control-Allow-Origin': '*' },
        dataType: 'json',
        type: 'POST',
        async: false,
        success: function (Data) {...}
});

- Amy B · Answer 7

你不能直接发送 application/json -- 它必须是 GET/POST 请求的参数之一。

所以应该像这样：

$.post(url, {json: "...json..."}, function());