Как отправить JSON вместо строки запроса с $.ajax?

Может ли кто-нибудь объяснить простым способом, как сделать jQuery отправлять фактический JSON вместо строки запроса?

$.ajax({
    url      : url,
    dataType : 'json', // I was pretty sure this would do the trick
    data     : data,
    type     : 'POST',
    complete : callback // etc
});

Это фактически преобразует ваш тщательно подготовленный JSON в строку запроса. Одна из неприятных вещей заключается в том, что любой array: [] в вашем объекте будет преобразован в array[]: [], вероятно, из-за ограничений запроса.

ОТВЕТЫ

Ответ 1

Вам нужно использовать JSON.stringify для первого сериализации вашего объекта в JSON, а затем указать contentType чтобы ваш сервер понял его JSON. Это должно сделать трюк:

$.ajax({
    url: url,
    type: "POST",
    data: JSON.stringify(data),
    contentType: "application/json",
    complete: callback
});

Обратите внимание, что объект JSON изначально доступен в браузерах, поддерживающих JavaScript 1.7/ECMAScript 5 или новее. Если вам нужна устаревшая поддержка, вы можете использовать json2.

Эти дополнительные данные изначально были неверно включены в предыдущую ревизию вопроса. Они были скопированы в этот принятый ответ.

Обратите внимание, что для этого требуются правильные заголовки CORS на стороне сервера, и, вопреки некоторым примерам в сети, Allow-Headers не могут использовать подстановочные знаки (в то время как Allow-Origin может).

{
    Content-Type                 : 'application/json', 
    Access-Control-Allow-Origin  : '*', 
    Access-Control-Allow-Headers : 'Content-Type' // You cannot use '*'
}

Также обратите внимание, что jQuery теперь отправит два запроса, один для завершения рукопожатия и один с фактическим содержимым. Это обычное поведение HTTP, называемое предполетным. Первый запрос будет заголовком OPTIONS, чтобы определить, действительно ли сервер совместим с запланированным запросом.

Поэтому имейте в виду, если вы хотите, чтобы ваш сервер был универсальным, строка запроса отправляет только один запрос. Используя true JSON отправляет по крайней мере два запроса, один для рукопожатия.

Ответ 2

Нет, параметр dataType предназначен для анализа полученных данных.

Чтобы опубликовать JSON, вам нужно будет сгенерировать его самостоятельно через JSON.stringify и установить для параметра processData значение false.

$.ajax({
    url: url,
    type: "POST",
    data: JSON.stringify(data),
    processData: false,
    contentType: "application/json; charset=UTF-8",
    complete: callback
});

Обратите внимание, что не все браузеры поддерживают объект JSON, и хотя jQuery имеет .parseJSON, он не содержит строковеда; вам понадобится другая библиотека polyfill.

Ответ 3

Хотя я знаю, что многие архитектуры, такие как ASP.NET MVC, имеют встроенные функции для обработки JSON.stringify как contentType. Моя ситуация немного отличается, поэтому, возможно, это может помочь кому-то в будущем. Я знаю, что это спасло бы часы!

Так как мои HTTP-запросы обрабатываются CGI-API из IBM (среда AS400) на другом подобласте, эти запросы имеют кросс-начало, а следовательно jsonp. Я действительно отправляю свой ajax через javascript-объекты. Вот пример моего ajax POST:

 var data = {USER : localProfile,  
        INSTANCE : "HTHACKNEY",  
        PAGE : $('select[name="PAGE"]').val(), 
        TITLE : $("input[name='TITLE']").val(), 
        HTML : html,
        STARTDATE : $("input[name='STARTDATE']").val(), 
        ENDDATE : $("input[name='ENDDATE']").val(),
        ARCHIVE : $("input[name='ARCHIVE']").val(), 
        ACTIVE : $("input[name='ACTIVE']").val(), 
        URGENT : $("input[name='URGENT']").val(), 
        AUTHLST :  authStr};
        //console.log(data);
       $.ajax({
            type: "POST",
           url:   "http://www.domian.com/webservicepgm?callback=?",
           data:  data,
           dataType:'jsonp'
       }).
       done(function(data){
         //handle data.WHATEVER
       });

Ответ 4

Если вы отправляете это обратно в asp.net и нуждаетесь в данных в request.form [], вам необходимо установить тип содержимого "application/x-www-form-urlencoded; charset = utf-8"

Оригинальный пост здесь

Во-вторых, избавитесь от типа данных, если вы не ожидаете возврата, POST будет ждать около 4 минут до сбоя. См. здесь