获取与jQuery JSON数据从.NET服务：混淆AJAX的设置 [英] Get JSON data with jQuery from a .NET service: confused with ajax setup

问题描述

我仅仅用了6小时试图得到这个直在我的头，我还没有成功。

有我的本地机器一个HelloWorld .NET 3.5的Web服务。 <一href="http://stackoverflow.com/questions/288850/how-to-return-json-from-a-2-0-asmx-web-service/289332#289332">Set按要求。
该服务返回列表自定义结构。

我试图用jQuery 1.4.4使用它。

当我尝试做 说的文档，我总是回从服务，一个XML响应这无论原因 parseerror jQuery中或者被传递作为一个愚蠢的字符串到成功功能。 也就是说，然而，我将的dataType 和接受（其中，根据该文件，控制如何收到的数据处理），我得到一个XML回来。

但是，当我做一些逻辑上并不从文档跟着，我顺利拿到我的对象的数组。 也就是说，当我忽略的dataType 和接受，并设定的contentType：应用程序/ JSON的;字符集= UTF-8相反，它正常工作但是的contentType ，根据文档，控制。数据的被发送的到服务器，没有收到。

---

在code：

  $。阿贾克斯（
  {
  键入：GET，
  网址：HTTP：//本地主机：52624 / Service1.asmx的/ HelloWorld的，
  数据类型：JSON，
  //接受可以是任何东西，也可以将其丢失，也没有关系，只依赖于dataType的
  成功：功能（数据，textStatus，jqXHR）{...}，
  错误：函数（jqXHR，textStatus，errorThrown）{...}
  }
）
 

结果：被称为错误处理程序，textStatus = parseerror

---

  $。阿贾克斯（
  {
  键入：GET，
  网址：HTTP：//本地主机：52624 / Service1.asmx的/ HelloWorld的，
  数据类型：应用/ JSON
  //接受可以是任何东西，也可以将其丢失，也没有关系，只依赖于dataType的
  成功：功能（数据，textStatus，jqXHR）{...}，
  错误：函数（jqXHR，textStatus，errorThrown）{...}
  }
）
 

结果：Web服务返回的XML，它传递给成功处理程序字符串

。

---

  $。阿贾克斯（
  {
  键入：GET，
  网址：HTTP：//本地主机：52624 / Service1.asmx的/ HelloWorld的，
  接受：JSON，//或应用/ JSON
  成功：功能（数据，textStatus，jqXHR）{...}，
  错误：函数（jqXHR，textStatus，errorThrown）{...}
  }
）
 

结果：Web服务返回的XML，它的解析，并通过为 IXMLDOMDocument2

。

---

  $。阿贾克斯（
  {
  键入：GET，
  网址：HTTP：//本地主机：52624 / Service1.asmx的/ HelloWorld的，
  的contentType：应用/ JSON的;字符集= UTF-8，
  成功：功能（数据，textStatus，jqXHR）{...}，
  错误：函数（jqXHR，textStatus，errorThrown）{...}
  }
）
 

结果：Web服务返回JSON，这将会部分的jQuery（数字和字符串被解析成对象的属性，但日期停留在/日（1303003305724）/<格式/解析code>）。

---

问题：

1. 请我理解jQuery的规范呢？其实对照为什么是说参数控制发送的数据接收到的数据？
2. 我在做什么公然错了吗？
3. 什么是最后一步拿到日期的jQuery解析，太？

解决方案

看起来像我要回答自己。
我不说，下面是绝对的真理。相反，它是我所发现的是工作。

---

所有的

首先，我发现了三个文章解释了很多：

• 使用jQuery消费ASP .NET JSON Web服务
• ASMX ScriptService的错误 - 无效的JSON原始
• 3错误使用jQuery与ASP.NET AJAX
在当前以避免

总之，随着.NET Web服务的问题是，你要打电话给他们以特殊的方式：

• 使用POST请求的（见下文）和
• 提供了内容类型应用程序/ JSON的;字符集= UTF-8

这是设计使然，出于安全考虑。
可能无法避免后者，则必须提供该内容类型。而且由于内容类型也决定参数如何连接codeD的请求，您必须连接code在JSON的参数。

这就是jQuery的跳跃，对于没有理由的jQuery会忽略的contentType 和连接code。在应用程序/ x-WWW您的参数-form-urlen codeD 。在这一点Web服务会不喜欢你说这里是JSON和提供方式-CN codeD的东西来代替。

在这些文章中，笔者建议您通过封闭的JSON数据，另一对引号玩jQuery的一招，这样它的PTED为一个字符串跨$ P $和没有得到的jQuery拨弄着：

  $。阿贾克斯（{
  键入：POST，
  网址：ServiceName.asmx / WebMethodName
  数据：{FNAME'：'大卫'，'LNAME'：'病房'}，
  的contentType：应用/ JSON的;字符集= UTF-8，
  数据类型：JSON，
  成功：函数（MSG）{...}
}）;
 

这确实工作确实如此。

另外，如果你没有任何数据，你还必须提供一个空的JSON对象， {} ，因为如果不这样做，jQuery将不设置内容长度，没有内容长度 Web服务将再次不喜欢你（更安全原因）。

---

不过。
由于FW 3.5，可以使用 GET 使用JSON功能的.NET服务。在这一点上，你可能不知道如何JSON-CN codeD参数配合GET请求。下面是如何。

如果您的Web服务没有任何参数，调用的是简单的：

  $。阿贾克斯（
  {
    键入：GET，
    网址：ServiceName.asmx / WebMethodName
    的contentType：应用/ JSON的;字符集= UTF-8，
    数据类型：JSON，
    成功：功能（数据，textStatus，jqXHR）{...}
  }
）;
 

如果有参数，然后调用也非常简单。什么，你需要做的是提供围绕参数的其他报价，应该有他们！这是因为你要这些报价显示为形式恩codeD请求的一部分。这样的形式恩codeD请求看起来有点像JSON-CN codeD一：

  $。阿贾克斯（
  {
    键入：GET，
    网址：ServiceName.asmx / WebMethodName
    的contentType：应用/ JSON的;字符集= UTF-8，
    数据：{DatePlaced：2011-05-13}，
    数据类型：JSON，
    成功：功能（数据，textStatus，jqXHR）{...}
  }
）;
 

此请求将导致看起来类似于一个请求：

  

GET /ServiceName.asmx/WebMethodName?DatePlaced="2011-05-13HTTP / 1.1
  内容类型：应用程序/ JSON;字符集= UTF-8

请注意所必需的类JSON的GET请求的报价，但会导致一个错误，如果你的意思是请求XML。

I've just spent six hours trying to get this straight in my head and I haven't succeeded.

There's a HelloWorld .NET 3.5 web service on my local machine. Set up as required.
The service returns a List of custom structures.

I'm trying to consume it with jQuery 1.4.4.

When I try to do what the documentation says, I always get back an XML response from the service, which either causes parseerror in jQuery or gets passed as a dumb string to the success function. That is, however I combine dataType and accepts (which, according to the documentation, control how the received data is handled), I get an XML back.

But, when I do something that does not logically follow from the documentation, I successfully get my array of objects. That is, when I ignore dataType and accepts, and set contentType: "application/json; charset=utf-8" instead, it works fine. But contentType, according to the docs, control the data being sent to the server, not received.

---

In code:

$.ajax(
  {
  type: "GET",
  url: "http://localhost:52624/Service1.asmx/HelloWorld",
  dataType: "json",
  //accepts can be anything, or it can be missing, doesn't matter, only depends on dataType
  success: function(data, textStatus, jqXHR) {...},
  error: function(jqXHR, textStatus, errorThrown) {...}
  }
)

Result: error handler called, textStatus = parseerror.

---

$.ajax(
  {
  type: "GET",
  url: "http://localhost:52624/Service1.asmx/HelloWorld",
  dataType: "application/json",
  //accepts can be anything, or it can be missing, doesn't matter, only depends on dataType
  success: function(data, textStatus, jqXHR) {...},
  error: function(jqXHR, textStatus, errorThrown) {...}
  }
)

Result: Web service returns XML, it's passed to the success handler as string.

---

$.ajax(
  {
  type: "GET",
  url: "http://localhost:52624/Service1.asmx/HelloWorld",
  accepts: "json",  // or "application/json"
  success: function(data, textStatus, jqXHR) {...},
  error: function(jqXHR, textStatus, errorThrown) {...}
  }
)

Result: Web service returns XML, it's parsed and passed as IXMLDOMDocument2.

---

$.ajax(
  {
  type: "GET",
  url: "http://localhost:52624/Service1.asmx/HelloWorld",
  contentType: "application/json; charset=utf-8",
  success: function(data, textStatus, jqXHR) {...},
  error: function(jqXHR, textStatus, errorThrown) {...}
  }
)

Result: Web service returns JSON, which gets partially parsed by jQuery (numbers and strings are parsed into properties of objects, but dates remain in the form of "/Date(1303003305724)/").

---

Questions:

1. Do I understand jQuery specs at all? Why is the parameter that is said to control sent data in fact controls received data?
2. What am I doing blatantly wrong?
3. What's the last step to get dates parsed by jQuery, too?

解决方案

Looks like I'm going to answer that myself.
I'm not saying the following is the absolute truth. Rather, it is what I have found to be working.

---

First of all, I found three articles that explained a lot:

• Using jQuery to Consume ASP.NET JSON Web Services
• ASMX ScriptService mistake – Invalid JSON primitive
• 3 mistakes to avoid when using jQuery with ASP.NET AJAX

In short, the problem with .NET web services is that you have to call them in a special way:

• Using a POST request (but see below), and
• Providing Content-Type of application/json; charset=utf-8

This is by design and for security reasons.
The latter may not be avoided, you must provide that content type. And because content type does dictate how parameters are encoded in the request, you must encode your parameters in JSON.

This is where jQuery jumps in. For no reason jQuery would ignore contentType and encode your parameters in application/x-www-form-urlencoded. At which point the web service will dislike you for saying "here is JSON" and providing form-encoded stuff instead.

In these articles, the author recommends that you play a trick with jQuery by enclosing your JSON data in another pair of quotes so that it's interpreted as a string and doesn't get fiddled with by jQuery:

$.ajax({
  type: "POST",
  url: "ServiceName.asmx/WebMethodName",
  data: "{'fname':'dave','lname':'ward'}",
  contentType: "application/json; charset=utf-8",
  dataType: "json",
  success: function(msg) {...}
});

This does work indeed.

Also, if you don't have any data, you still must provide an empty JSON object, {}, because if you don't, jQuery will not set Content-Length, and without Content-Length the web service will dislike you again (more security reasons).

---

However.
Since FW 3.5, it is possible to use GET with JSON-enabled .NET services. At which point you might wonder how JSON-encoded parameters align with GET requests. Here's how.

If your web service doesn't have any parameters, the call is simple:

$.ajax(
  {
    type: "GET",
    url: "ServiceName.asmx/WebMethodName",
    contentType: "application/json; charset=utf-8",
    dataType: "json",
    success: function(data, textStatus, jqXHR) {...}
  }
);

And if there are parameters, then the call is also simple. What you have to do is provide additional quotes around parameters that should have them! This is because you want these quotes to appear as part of the form-encoded request. This way the form-encoded request will look sort of like json-encoded one:

$.ajax(
  {
    type: "GET",
    url: "ServiceName.asmx/WebMethodName",
    contentType: "application/json; charset=utf-8",
    data: {DatePlaced:'"2011-05-13"'},
    dataType: "json",
    success: function(data, textStatus, jqXHR) {...}
  }
);

This request will result in a request that looks similar to:

GET /ServiceName.asmx/WebMethodName?DatePlaced="2011-05-13" HTTP/1.1
Content-Type: application/json; charset=utf-8

Note the quotes that are required for JSON-like GET requests, but cause an error if you meant to ask for XML.

这篇关于获取与jQuery JSON数据从.NET服务：混淆AJAX的设置的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！