为什么我的 $.ajax() JSON 数据会这样回传到服务器？

Question

我有一个 javascript 中的项目列表：

var list = {
    { id: 1, name: 'Charles' }, 
    { id: 8, name: 'John' }, 
    { id: 13, name: 'Sally' }
};

但是当我像这样将它发布到服务器时：

$.ajax({
    url: '/Controller/ActionName',
    data: { items: list }
});

它像这样到达服务器：

items[0][id]=1&items[0][name]=Charles&items[1][id]=8&items[1][name]=John&items[2][id]=13&items[2][name]=Sally

我如何让它以 JSON 表示法到达，即用大括号！以便.NET 解析器可以正确解析它？

Answer 1

试试：

$.ajax({
    url: '/Controller/ActionName',
    data: { items: JSON.stringify(list) }
});

我尝试了以下选项：

 <script type="text/javascript">

    var list = [
    { id: 1, name: 'Charles' }, 
    { id: 8, name: 'John' }, 
    { id: 13, name: 'Sally' }
];


  function run(){
      $.ajax({
          url: 'default.aspx',
          data: { items: JSON.stringify(list) }
      });

      return false;

  }

  function run2() {
      $.ajax({
          url: 'default.aspx',
          data: { items: list }
      });
      return false;

  }

  function run3() {
      $.ajax({
          url: 'default.aspx',
          data: { items: list },
          processData: false
      });
      return false;
  }

  function run4() {
      $.ajax({
          url: 'default.aspx',
          data: list
      });
      return false;
  }
</script>

运行 1：default.aspx?items=%5B%7B%22id%22%3A1%2C%22name%22%3A%22Charles%22%7D%2C%7B%22id%22%3A8% 2C%22name%22%3A%22John%22%7D%2C%7B%22id%22%3A13%2C%22name%22%3A%22Sally%22%7D%5D

Querystring["items"] = '[{"id":1,"name":"Charles"},{"id":8,"name":"John"},{"id":13 ,"姓名":"莎莉"}]'

运行 2：default.aspx?items%5B0%5D%5Bid%5D=1&items%5B0%5D%5Bname%5D=Charles&items%5B1%5D%5Bid%5D=8&items%5B1%5D%5Bname %5D=John&items%5B2%5D%5Bid%5D=13&items%5B2%5D%5Bname%5D=Sally

项目[0][id] 1

items[0][name] 查尔斯

项目[1][id] 8

items[1][name] 约翰

项目[2][id] 13

物品[2][名称] 莎莉

运行 3：default.aspx?[object%20Object]

[对象对象]

运行 4：default.aspx?Charles=undefined&John=undefined&Sally=undefined

请求[“查尔斯”] = '未定义'

请求[“约翰”] = '未定义'

请求["Sally"] = '未定义'

现在来自 OP，我认为 Run 1 是必需的选项，因为他想在服务器端处理 JSON 字符串？

Answer 2

我在我的手机上，但您可以通过使用以下库将您的 JSON 对象转换为格式良好的 JSON 字符串来解决此问题。

jquery JSON project

该库只有 3k 大小，还为您提供额外的 JSON 功能，例如解析等。

在页面中包含脚本后，您可以将对象转换为 JSON 字符串并使用以下方法进行调用：

$.ajax({
        type: "POST",
        url: '/Controller/ActionName',
        cache: false,
        data: $.toJSON(list), // Convert JSON object to String for Post
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function (response) {
            GenerateResultsCallback(response.d)
        },
        error: function (e) {
            alert('error during ajax request');
        }
    });

Answer 3

来自 JQuery AJAX Page:

数据选项可以包含 表单的查询字符串 key1=value1&key2=value2，或映射 形式 {key1: 'value1', key2: '值2'}。如果使用后一种形式， 数据被转换为查询 发送之前的字符串。这 处理可以通过 将 processData 设置为 false

因此您的 JSON 对象被转换为查询字符串。

Answer 4

使用 $.post() 而不是 $.ajax() 它应该适合你。

$.ajax 执行 GET 请求，这就是为什么它将您的 JSON 转换为字符串并附加到查询字符串的原因。

编辑： 看起来您正在尝试发布对象列表，在这种情况下，您的 var 应该是这样的对象数组：

var list = [
    { id: 1, name: 'Charles' }, 
    { id: 8, name: 'John' }, 
    { id: 13, name: 'Sally' }
];


$.post({
    url: '/Controller/ActionName',
    data: { "items": list }
});