当前位置:  首页  >  前端开发  >  JavaScript

ajax跨域调用webservice的实现代码_javascript技巧

这篇文章主要介绍了ajax跨域调用webservice服务例子和理解,最近ajax访问webservice遇到跨域的问题,网上搜索资料,总结如下
  最近ajax访问webservice遇到跨域的问题,网上搜索资料,总结如下(很多都是觉得人家总结不错的复制下来)

  <<用JSON来传数据,靠JSONP来跨域>>

  先上我的已实现代码:

  前端代码:

$.ajax({
 type: "get",
 url: "http://localhost/Service1.asmx/getElevatorStatusJsonData?jsoncallback=?",
 dataType: "jsonp",
 jsonp: "json",
 data: "",
 success: function (result) {
 var data = eval(result);
 for (var i = 0; i < data.length; i++) {
 alert(data[i].ID + "--" + data[i].Name);
 }
 },
 error: function (a, b, c) {
 alert(c);
 }
 }); 

  服务端代码:

 /// 
 /// 获取状态数据信息
 /// 
 /// 
 [WebMethod]
 public void getElevatorStatusJsonData()
 {
 List> elevatordatas = new List>();
 List searchList = XmlSerializeHelper.XmlDeserializeFromFile>(@ConfigUtil.servicePath + ConfigUtil.getConfigByKey("xmlPath") + "查询指令信息.xml", Encoding.UTF8);
 foreach (SendDicdate item in searchList)
 {
 string key = item.portno + "-" + item.bordrate + "-" + item.sendtype;
 List deviceInfoList = (List)Context.Cache.Get(key);
 elevatordatas.Add(deviceInfoList);
 }

 String result = "";
 DataContractJsonSerializer json = new DataContractJsonSerializer(elevatordatas.GetType());
 using (MemoryStream stream = new MemoryStream())
 {
 json.WriteObject(stream, elevatordatas);
 result = Encoding.UTF8.GetString(stream.ToArray());
 }
 String jsoncallback = HttpContext.Current.Request["jsoncallback"];
 result = jsoncallback + '(' + result + ')';
 HttpContext.Current.Response.Write(result);
 HttpContext.Current.Response.End();

 }

  c#

   以上是调用c#服务端的实现代码,下面的是java端的,?#38382;?#21487;能有差异,但原理是相通的

  java:

  

String callbackFunName = context.Request["callbackparam"];
  context.Response.Write(callbackFunName + "([ { \"name\":\"John\"}])");

  PS:客户端的jsonp?#38382;?#26159;用来通过url传参,传递jsonpCallback?#38382;?#30340;?#38382;?#21517;,比较拗口,通俗点讲:

  jsonp: ""

  jsonpCallback:""

  顺带一提:在chrome浏览器里,还可以在服务端设置header信息context.Response.AddHeader("Access-Control-Allow-Origin", "*");来达到跨域请求的目的,并且不需要设置ajax以下?#38382;?/p>

  

dataType : "jsonp",
  jsonp: "callbackparam",
  jsonpCallback:"jsonpCallback1"

  以正常ajax请求方式就可以获得数据。

下面是原理,看别人讲解的,感觉很有道理:

  1、一个众所周知的问题,Ajax直接请求普通文件存在跨域无权限访问的问题,甭管你是静态页面、动态网页、web服务、WCF,只要是跨域请求,一律不准;

  2、不过我们又发现,Web页面上调用js文件时则不受是否跨域的影响(不仅如此,我们还发现凡是拥?#23567;眘rc”这个属性的标签都拥有跨域的能力,比如

  3、于是可以判断,当前阶段如果想通过纯web端(ActiveX控件、服务端代理、属于未来的HTML5之Websocket等方式不算)跨域访问数据就只有一种可能,那就是在远程服务器上设法把数据装进js格式的文件里,供客户端调用和进一步处理;

  4、恰巧我们已经知道有一种叫做JSON的纯字符数据格式可以简洁的描述复杂数据,更妙的是JSON还被js原生支持,所以在客户端几乎可以随心所欲的处理这?#25351;?#24335;的数据;

  5、这样子解决方案就呼之欲出了,web客户端通过与调用脚本一模一样的方式,来调用跨域服务器上动态生成的js格式文件(一般以JSON为后缀),?#36828;准?#26381;务器之所以要动态生成JSON文件,目的就在于把客户端需要的数据装入进去。

  6、客户端在对JSON文件调用成功之后,也就获得了自己所需的数据,剩下的就?#21069;?#29031;自己需求进行处理和展现了,这种获取远程数据的方式看起来非常像AJAX,但其实并不一样。

  7、为了便于客户端使用数据,逐渐形成了一种非正式传输协议,人?#21069;?#23427;称作JSONP,该协议的一个要点就是允许用户传递一个callback ?#38382;?#32473;服务端,然后服务端返回数据时会将这个callback?#38382;?#20316;为函数名来包裹住JSON数据,这样客户端就可以随意定制自己的函数来自动处理返回数 据了。

  聪明的开发者很容易想到,只要服务端提供的js脚本是动态生成的就行了呗,这样调用者可?#28304;?#19968;个?#38382;?#36807;去告诉服务端“我想要一段调用XXX函数的js代码,请你返回给我”,于是服务器就可以按照客户端的需求来生成js脚本并响应了。


幸运飞艇单双全天在线计划 广东时时彩开奖直播网 3D必出一个 彩票介绍 包赢时时彩 福利彩票排列7走势图 体彩大乐透排列3开奖 最新福建22选5开奖结果查询 pk10开奖记录结果 广州地中海夜总会公主 安徽省7月1号实施国六吗 159游戏娱乐平台下载 如何领取彩票大奖 二八杠绝技 甘肃十一选五遗漏数据前三直 Untitled Page
扫码关注 PHP1 官方微信号
PHP1.CN | 中国最专业的PHP中文社区 | PHP资讯 | PHP教程 | 数据库技术 | 服务器技术 | 前端开发技术 | PHP框架 | 开发工具 | PHP问答
Copyright ? 1998 - 2020 PHP1.CN. All Rights Reserved PHP1.CN 第一PHP社区 版权所有
     
幸运飞艇单双全天在线计划 广东时时彩开奖直播网 3D必出一个 彩票介绍 包赢时时彩 福利彩票排列7走势图 体彩大乐透排列3开奖 最新福建22选5开奖结果查询 pk10开奖记录结果 广州地中海夜总会公主 安徽省7月1号实施国六吗 159游戏娱乐平台下载 如何领取彩票大奖 二八杠绝技 甘肃十一选五遗漏数据前三直