关于 Jquery getJSON方法的一点心得

最近需要做一个纯静态html的网站,所以数据交互ajax必不可少,于是选择Jquery,本地调试一切正常,但是,上了服务器之后就有问题了。

首先在FF上面出现这个错误:

Error: [Exception... "Access to restricted URI denied" code: "1012" nsresult: "0x805303f4 (NS_ERROR_DOM_BAD_URI)" location: "http://localhost:1234/JavaScript/JQurey/jquery-1.2.6.min.js Line: 28"]

IE下面呢倒是可以通过,但是会出现下面这个警告信息:

点完Yes之后是可以得到效果的。但是这样对于网站的客户来说,实在是很糟糕的体验。

于是google Access to restricted URI denied”,发现问题出在Cross-Domain上面,看了Jquery的开发资料得知,从1.2版本开始使用 jQuery.getJSON(url,[data],[callback]) 来进行跨域提交,参考如下:

As of jQuery 1.2, you can load JSON data located on another domain if you specify a JSONP callback, which can be done like so: "myurl?callback=?". jQuery automatically replaces the ? with the correct method name to call, calling your specified callback.

看了上面 JSONP的链接,几乎一无所获,按照其要求我加上了?callback=?",还是取不到任何数据,我的JS代码如下:


Code

但是始终得不到数据,断点设到data.name一行,从来没有被执行过。于是,开始考察jsoncallback=?,发现这个其实是有值的,只是自己一直没有handle(其实是因为自己不知道怎么样handlegoogle很久,几乎没有找到任何直接使用ashx来处理remote json的例子),但是搜到一篇元老级的文章,是一篇专门介绍jquery ajax的文章,上面说需要将jsoncallback的值传回来,原来如此,于是就将ashx的方法修改了一下,几经转折,终于调试出来下面的代码:


Code

其中,JsonObjectCollection 类要引用using System.Net.Json;JSON官方网站推荐的一个dll,我没有用JSON.Net,是因为我是2.0的,于是我使用这个,感觉也很不错。使用这个的好处是对于html代码的处理,因为json是通过“”传递数据的,但是html中也是含有“”的,如果直接手动拼写,会很麻烦。

这个ashx执行的结果如下:

jsonXXXXXXXXXXXXXX?

 

 

其中 jsonXXXXXXXXXXXXXX 就是context.Request.QueryString["jsoncallback"] 的值。

在页面当中的效果如下:

登陆之后的结果如下:

下面的那个cart也是通过相同的效果做出来的。



 下面是按照回复做出来的demo,我把System.Net.Json也放进去了。

 /Files/mygift/demo.zip

版权声明:本文原创发表于博客园,作者为Kevin Shi
本文版权归作者和博客园共有,欢迎转载,但未经作者同意必须保留此段声明,且在文章页面明显位置给出原文连接,否则视为侵权。

posted on 2008-12-11 16:45 Kevin Shi 阅读(...) 评论(...) 编辑 收藏

导航

公告