jquery ajax跨域asp,jQuery Ajax 实现跨域名请求的方法 JSONP - 服务端C#/ASP.NET示例代码图文讲解...
Web Service 是不能进行跨域请求数据的,但是我们应该怎么解决jQuery Ajax 跨域请求数据的方法呢。JSONP就是答案,我们可以使用JSONP实现jQuery Ajax跨域访问的问题。什么是JSONP?说说jsonp是怎么产生的吧,首先下面几个问题应该了解:Ajax直接请求跨域的静态、动态网页、Web Service等等,只要是跨域的,一律是不允许的。回忆一下,我们在HTML页面中
Web Service 是不能进行跨域请求数据的,但是我们应该怎么解决jQuery Ajax 跨域请求数据的方法呢。JSONP就是答案,我们可以使用JSONP实现jQuery Ajax跨域访问的问题。
什么是JSONP?
说说jsonp是怎么产生的吧,首先下面几个问题应该了解:
Ajax直接请求跨域的静态、动态网页、Web Service等等,只要是跨域的,一律是不允许的。
回忆一下,我们在HTML页面中使用script、img标签的时候是没有受到跨域的影响。
于是想到了解决方案,就是把服务器端的数据封装在js文件中,客户端可以通过获取js跨域文件的方法来获取数据
回想一下,我们服务端如果直接返回给Ajax请求返回json格式的数据时候,客服端Ajax方法的success:function(e)是可以接受json数据的。所以我们服务端动态生成json文件返回给客服端使用是可以实现的。
所以在这种思想下,形成了一种看似非正常的网络协议,这就是JSONP,这个协议的关键点是允许用户传递一个callback参数给服务端,然后服务端将这个callback参数的值作为js的函数名来封装JSON数据,这样客户端就可以实现跨域访问来处理数据了。
示例代码如下所示:
$.ajax({
type : "post",
url :'http://跨域域名/test?callback=GetPersonName',
dataType : "jsonp",
jsonpCallback:"callback",//传递给请求处理程序或页面的,用以获得jsonp回调函数名的参数名(一般默认为:callback)
jsonpCallback:"GetPersonName",//自定义的jsonp回调函数名称,默认为jQuery自动生成的随机函数名,也可以写"?",jQuery会自动为你处理数据
success: function(json){
alert('用户名为: ' + json.Name);
},
error: function(){
alert('fail');
}
});
服务端C#代码如下所示
String callbackFunName = Request.QueryString["callback"];
Response.Write(callbackFunName + "({ \"name\":\"知道91博客\"})");
服务端获取到callback的值为GetPersonName,然后返回GetPersonName({ \"name\":\"知道91博客\"})这个字符串给客服端,jQuery由于封装了JSONP,在处理jsonp类型的ajax时会自动将返回GetPersonName({ \"name\":\"知道91博客\"})中的参数{ \"name\":\"知道91博客\"}传递给success:function(json)的属性方法,因此我们可以看到显示“用户名为:知道91博客”的弹出框。
好了,到此通过jQuery的Ajax的JSONP方法就可以实现跨域请求数据。
魔乐社区(Modelers.cn) 是一个中立、公益的人工智能社区,提供人工智能工具、模型、数据的托管、展示与应用协同服务,为人工智能开发及爱好者搭建开放的学习交流平台。社区通过理事会方式运作,由全产业链共同建设、共同运营、共同享有,推动国产AI生态繁荣发展。
更多推荐



所有评论(0)