Как отправить 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 минут до сбоя. См. здесь