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


почему код ниже отправил данные как 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);
        }
    }
);
5 57

5 ответов:

потому что вы не указали ни тип контента запроса, ни правильный запрос 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
  • The 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 объектов.

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

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

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

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

data: JSON.stringify(arr);

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

Я написал короткую функцию удобства для публикации 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);
});

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

вам нужно установить правильный тип контента и stringify объект.

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);
    }
});