首页新闻找找看学习计划

请教一个关于jsonp的问题

0
悬赏园豆:20 [已解决问题] 解决于 2015-06-05 13:40

一个Asp.NET的web项目中要用到跨域请求,用的是jquery的ajax来请求的,

于是上网找了下关于jsonp的资料,最后总结了一下它的意思是:

 

只要将dataType:"json"改成jsonp,并且在请求的URL后加个?callback=xxx,这个xxx是回调js函数的名称,这样就可以跨域请求并返回数据了.

 

可是我在实际应用中,发现一些问题:

1,要发起跨域请求,必须去掉contentType:"application/json;charset=utf-8"这串字符,让其采用默认的"application/x-www-form-urlencoded"向服务器发送数据.

 

2,去掉这行后,无论我下边的返回格式中dataType:"json"是否改成jsonp都无所谓,只要发起请求,服务器端就能进入断点.

 

3,去掉这行后,原来的data:"{jsonstring..}"部分要去掉双引号,貌似直接用js对象传递数据了.

 

4,如果用了jquery的话,它会自动帮你生成一个随机的回调函数名,你可以直接忽略掉回调函数的部分,意思是说只要将回返类型写成dataType:"jsonp",其它的部分和普通的json请求完全一样,jquery会自动生成函数,处理完成后将数据放在success:fun..的回调函数中.

不知道这些问题大家遇到过没有...

 

好了,接下来我要问的问题是:

通过上边去掉的那行后,服务器能进入断点,

去掉双引号后能正确接收参数,并且能正确返回json字符串,

可是在客户端的ajax完成请求后,一直进入err:部分的回调函数,我跟踪err的内容,发现错误信息是浏览器阻止跨域请求...我就郁闷了:

你浏览器要是真的阻止,那怎么还能进入服务器端的断点?

人家服务器已经将数据返回了,为什么你还不进入success的函数里去呢?

 

我又去网上找了一下,说是如果指定的返回类型为jsonp的话,那么,返回的内容就是js脚本了,所以服务器端返回的时候,要将返回的字符串拼成js的格式,也就是说 xxx('jsonStr'),在原来返回的字符串外加一个客户端的回调函数名称,我照做,在服务器中拼了xxx,在客户端写了个xxx,并且在url中指定了这个xxx,可是还是进入err:...

 

于是我不知道怎么办了,上来请教大神们,请指导一下,介于上边说的第4点,我将请求的代码改成如下:

客户端:

 

服务器端:

 

再次感谢您的认真回答!

hexllo的主页 hexllo | 菜鸟二级 | 园豆:405
提问于:2015-06-05 10:09
< >
分享
最佳答案
0

只要在IIS的响应头里添加一个Access-Control-Allow-Origin,*的键值对即可,前后台代码和普通的json请求完全一样,前台用json请求就可以,不用jsonp

hexllo | 菜鸟二级 |园豆:405 | 2015-06-05 13:40
其他回答(1)
0

http://learn.jquery.com/ajax/working-with-jsonp/

你看F12看下响应正文。我觉得是前段调用的问题,你后端并没有拼接json字符串。

收获园豆:20
吴瑞祥 | 园豆:28621 (高人七级) | 2015-06-05 10:37

是的,我拼后没有用,就取消了.

支持(0) 反对(0) hexllo | 园豆:405 (菜鸟二级) | 2015-06-05 10:46

@hexllo: 拼是一定要拼的,不过你这个是webapi吗?你必须要写一个格式输出自定义。

不然他会把结果输出为1个js字符串变量。而不是一段直接的字符串,直接的字符串能被识别为js脚本执行。

支持(0) 反对(0) 吴瑞祥 | 园豆:28621 (高人七级) | 2015-06-05 11:01

@吴瑞祥: 我试了一下,直接在后台方法里的第一行写 return "opRes(123);",然后在前台写一个js方法,

opRes(v)

{

alert(v);

}

在IE浏览器里可以正确弹出,在FF和Chrome里还是进入err函数,按F12看到的提示如下:

XMLHttpRequest cannot load http://192.168.1.104/t/commonAPI/SetReaded. No 'Access-Control-Allow-Origin' header is present on the requested resource. Origin 'null' is therefore not allowed access.

请问怎么解决呢?

支持(0) 反对(0) hexllo | 园豆:405 (菜鸟二级) | 2015-06-05 11:32

@吴瑞祥: 自己解决了,谢谢你

支持(0) 反对(0) hexllo | 园豆:405 (菜鸟二级) | 2015-06-05 13:40
清除回答草稿
   您需要登录以后才能回答,未注册用户请先注册