Отправить данные JSON с помощью jQuery

Question

Почему приведенный ниже код отправляет данные как City=Moscow&Age=25 вместо формата JSON?

var arr = {City:'Moscow', Age:25};
$.ajax(
   {
        url: "Ajax.ashx",
        type: "POST",
        data: arr,
        dataType: 'json',
        async: false,
        success: function(msg) {
            alert(msg);
        }
    }
);

Answer 1

Поскольку вы не указали ни тип содержимого запроса, ни правильный запрос JSON.Вот правильный способ отправки запроса JSON:

var arr = { City: 'Moscow', Age: 25 };
$.ajax({
    url: 'Ajax.ashx',
    type: 'POST',
    data: JSON.stringify(arr),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: false,
    success: function(msg) {
        alert(msg);
    }
});

На что обратить внимание:

• Использование метода JSON.stringify для преобразования объекта javascript в строку JSON, котораяродные и встроенные в современные браузеры.Если вы хотите поддерживать более старые браузеры, вам может потребоваться включить json2.js
• Указание типа содержимого запроса с помощью свойства contentType, чтобы указать серверу намерение отправитьЗапрос JSON
• Свойство dataType: 'json' используется для типа ответа, который вы ожидаете от сервера.jQuery достаточно умен, чтобы угадать его с сервера Content-Type заголовок ответа.Поэтому, если у вас есть веб-сервер, который более или менее уважает протокол HTTP и отвечает Content-Type: application/json на ваш запрос, jQuery автоматически проанализирует ответ в объект javascript в обратном вызове success, поэтому вам не нужно указыватьdataType свойство.

С чем следует быть осторожным:

• То, что вы называете arr, не массив .Это объект javascript со свойствами (City и Age).Массивы обозначены [] в JavaScript.Например, [{ City: 'Moscow', Age: 25 }, { City: 'Paris', Age: 30 }] - это массив из 2 объектов.

Answer 2

Поскольку по умолчанию jQuery сериализует объекты, переданные в качестве параметра data в $.ajax.Он использует $.param для преобразования данных в строку запроса.

Из документов jQuery для $.ajax:

[аргумент data] преобразуется в строку запроса, если это еще не строка

Если вы хотите отправить JSON, вам придется кодировать его самостоятельно:

data: JSON.stringify(arr);

Обратите внимание, что JSON.stringify присутствует только в современных браузерах.Для получения более ранней поддержки обратитесь к json2.js

Answer 3

Я написал короткую вспомогательную функцию для публикации JSON.

$.postJSON = function(url, data, success, args) {
  args = $.extend({
    url: url,
    type: 'POST',
    data: JSON.stringify(data),
    contentType: 'application/json; charset=utf-8',
    dataType: 'json',
    async: true,
    success: success
  }, args);
  return $.ajax(args);
};

$.postJSON('test/url', data, function(result) {
  console.log('result', result);
});

Answer 4

Вам необходимо установить правильный тип содержимого и привести в соответствие ваш объект.

var arr = {City:'Moscow', Age:25};
$.ajax({
    url: "Ajax.ashx",
    type: "POST",
    data: JSON.stringify(arr),
    dataType: 'json',
    async: false,
    contentType: 'application/json; charset=utf-8',
    success: function(msg) {
        alert(msg);
    }
});

Answer 5

Он сериализуется, так что URI может читать пары имя-значение в запросе POST по умолчанию.Вы можете попробовать установить processData: false в ваш список параметров.Не уверен, поможет ли это.