Jquery Ajax将json发布到webservice

Question

我试图将一个JSON对象发布到asp.net webservice.

我的json看起来像这样:

var markers = { "markers": [
  { "position": "128.3657142857143", "markerPosition": "7" },
  { "position": "235.1944023323615", "markerPosition": "19" },
  { "position": "42.5978231292517", "markerPosition": "-3" }
]};

我使用json2.js来串行我的json对象.

我正在使用jquery将其发布到我的webservice.

  $.ajax({
        type: "POST",
        url: "/webservices/PodcastService.asmx/CreateMarkers",
        data: markers,
        contentType: "application/json; charset=utf-8",
        dataType: "json",
        success: function(data){alert(data);},
        failure: function(errMsg) {
            alert(errMsg);
        }
  });

我收到以下错误:

"无效的JSON原语:

我发现了一堆与此相关的帖子,这似乎是一个非常常见的问题,但我没有尝试解决这个问题.

当firebug发布到服务器的内容时​​,它看起来像这样:

标记%5B0%5D%5Bposition%5D = 128.3657142857143&标记%5B0%5D%5BmarkerPosition%5D = 7&标记%5B1%5D%5Bposition%5D = 235.1944023323615&标记%5B1%5D%5BmarkerPosition%5D = 19&标记%5B2%5D%5Bposition% 5D = 42.5978231292517&标记%5B2%5D%5BmarkerPosition%5D = -3

我正在调用的webservice函数是:

[WebMethod]
public string CreateMarkers(string markerArray)
{
    return "received markers";
}

Answer 1

您提到使用json2.js来对您的数据进行字符串化,但是POSTed数据似乎是URLEncoded JSON您可能已经看过它,但这篇关于无效JSON原语的帖子涵盖了JSON被URLEncoded编码的原因.

我建议不要将原始的,手动序列化的JSON字符串传递给您的方法.ASP.NET将自动JSON反序列化请求的POST数据,因此如果您手动序列化并向ASP.NET发送JSON字符串,您实际上最终将需要JSON序列化您的JSON序列化字符串.

我会在这些方面提出更多建议:

var markers = [{ "position": "128.3657142857143", "markerPosition": "7" },
               { "position": "235.1944023323615", "markerPosition": "19" },
               { "position": "42.5978231292517", "markerPosition": "-3" }];

$.ajax({
    type: "POST",
    url: "/webservices/PodcastService.asmx/CreateMarkers",
    // The key needs to match your method's input parameter (case-sensitive).
    data: JSON.stringify({ Markers: markers }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    failure: function(errMsg) {
        alert(errMsg);
    }
});

避免无效JSON原语问题的关键是将jQuery传递给data参数的JSON字符串,而不是JavaScript对象,以便jQuery不会尝试URLEncode您的数据.

在服务器端,将方法的输入参数与您传入的数据的形状相匹配:

public class Marker
{
  public decimal position { get; set; }
  public int markerPosition { get; set; }
}

[WebMethod]
public string CreateMarkers(List<Marker> Markers)
{
  return "Received " + Markers.Count + " markers.";
}

Marker[] Markers如果您愿意,也可以接受数组.ASMX ScriptServices使用的解串器(JavaScriptSerializer)非常灵活,可以将输入数据转换为您指定的服务器端类型.

Answer 2

1. markers不是JSON对象.这是一个普通的JavaScript对象.
2. 阅读有关data:选项:

   要发送到服务器的数据.如果不是字符串,它将转换为查询字符串.

如果要将数据作为JSON发送,则必须先对其进行编码:

data: {markers: JSON.stringify(markers)}

jQuery不会自动将对象或数组转换为JSON.

但我认为错误消息来自解释服务的响应.您发回的文本不是JSON.JSON字符串必须用双引号括起来.所以你必须这样做:

return "\"received markers\"";

我不确定您的实际问题是发送还是接收数据.

Answer 3

我尝试了 Dave Ward 的解决方案。由于contentType设置为 ，因此数据部分未在 post 请求的有效负载部分中从浏览器发送"application/json"。一旦我删除了这条线，一切都很好。

var markers = [{ "position": "128.3657142857143", "markerPosition": "7" },

               { "position": "235.1944023323615", "markerPosition": "19" },

               { "position": "42.5978231292517", "markerPosition": "-3" }];

$.ajax({

    type: "POST",
    url: "/webservices/PodcastService.asmx/CreateMarkers",
    // The key needs to match your method's input parameter (case-sensitive).
    data: JSON.stringify({ Markers: markers }),
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data){alert(data);},
    failure: function(errMsg) {
        alert(errMsg);
    }
});