使用Jquery应用到Asp.net ajax中时3个误区应该避免

原文:明轩的blog
Ajax中使用json这个轻量级数据类型通信的好处相信大家已经很清楚,考虑到安全问 题,Asp.net Ajax的webService使用json,应该防止Json Hijacking。因此通常我们的做法是在使用Post请求式,并将请求的content-type设置成application/json; charset=utf-8。但客户端如果你使用的是Jquery,有三个细节问题是我们应该注意的:

      1 :如果我们Post时没有任何数据传给服务端,请指定Data:{} 如:

     

Code
1 $.ajax({
2    type: "POST",
3    url: "PageMethod.aspx/PageMethodName",
4    data: "{}",//注意这里不可省。
5    contentType: "application/json; charset=utf-8",
6    dataType: "json"
7 });

 

   这是因为在IIS中post请求时Content —Length是必须提供的,即使没用任何Post Data.Content-Length也应该设为0,但这样的话Jquery不会自动设置Header,除非请求中包含post Data。而Asp.net Ajax的json传输,又要求post方式,因此我们不能改变他的请求方式。简便的解决法案就是在请求中给定一个空的json 对象。以符合IIS的要求,此时Content-Length为2。这时在服务端我可以完全忽略这个为空的参数,并处理相应的请求。

 

    2:当post data 不为空时。我们应该避免在beforeSend事件里设置RequestHeader。
     如一点所述的范例post data 为空时,既然jquery不能自动设置Header,我们能否手工帮他设置呢?答案时是
肯定的。这时我们是在beforeSend事件中设置的。如代码所示(请注意:必须设置为application/json否则webservice
时不会返回json。这也是出于安全的考虑)。
Code

1 $.ajax({

2    type: "POST",

3    url: "WebService.asmx/WebMethodName",

4    beforeSend: function(xhr) {

5      xhr.setRequestHeader("Content-type",

6                          "application/json; charset=utf-8");

7    },

8    dataType: "json"

9 });
    但时此时问题又来了,在IE中XmlHttpRequst的setRequestHeader不时直接完全的设置RequstHeader。而是
已有的基础上附加setRequestHeader参数所指定的以形成新的header。这样的话,在jquery会在包含Post Data请求
的header中自动设置content-type为默认application/x-www-form-urlencoded ,而在beforeSend又会被重新追
加一个application/json; charset=utf-8。此时Content-Type变成了 application/x-www-form-urlencoded, 
application/json; charset=utf-8(在ff会重新设置)。很显然这个content-type不为Asp.net Ajax所接受。webservice
不会返回任何json。因此包含post data时建议使用下列方式保证返回的为json
Code

$.ajax({

   type:
"POST",

   url:
"WebService.asmx/WebMethodName",

   data:
"{'fname':'dave', 'lname':'ward'}",

   contentType:
"application/json; charset=utf-8",

   dataType:
"json"

});
  3:注意区分json对象和json形式的字符串。
  看看下面代码:
Code

$.ajax({

   type:
"POST",

   url:
"WebService.asmx/WebMethodName",

   data: {
'fname':'dave', 'lname':'ward'},

   contentType:
"application/json; charset=utf-8",

   dataType:
"json"

});
 咋一看没什么问题,想当然的认为data会乖乖的post给服务端。但实际上这是不正确的。请仔细看此时data时json
表示的对象。此时Json表示的对象会被Jquery序列化。如上述例子data将是fname=dave&lname=ward。再看如下:

Code

1 $.ajax({

2    type: "POST",

3    url: "WebService.asmx/WebMethodName",

4    data: "{'fname':'dave', 'lname':'ward'}",

5    contentType: "application/json; charset=utf-8",

6    dataType: "json"

7 });
这时data才是我们期望的。其形式:{'fname':'dave', 'lname':'ward'}。小小语义的改变就可以造成如此大的不同。
因此,我们在编程过程中应该特别注意。以免浪费时间。
注:有关细节可以参看3 mistakes to avoid when using jQuery with ASP.NET AJAX ,有更详细的说明。我只是
重新用中文简要的重述一下其中讲到的问题。
英文原文:http://encosia.com/2008/06/05/3-mistakes-to-avoid-when-using-jquery-with-aspnet-ajax/

posted @ 2008-12-30 13:36  LiveStar  阅读(526)  评论(0编辑  收藏  举报