DBMNG数据库管理与应用

书籍是全世界的营养品。生活里没有书籍,就好像没有阳光;智慧里没有书籍,就好像鸟儿没有翅膀。
当前位置:首页 > 经验分享 > Javascript

jQuery中实现ajax跨域请求访问

现在做的课题要实现在一个没有部署在服务器上的网页中,使用ajax来加载已经 部署在服务器上的一个服务提供的数据。

先看静态页面的代码:

  1. <html>  
  2.     <head>  
  3.         <script type="text/javascript" src="jquery.js"></script>  
  4.         <script type="text/javascript">     
  5. $(document).ready(function(){  
  6.     $("#go").click(ajaxget);  
  7. });  
  8. function ajaxget(){  
  9.     $.ajax({  
  10.         type : "get",  
  11.         async:false,  
  12.         url : "http://localhost/c.txt",  
  13.         dataType : "jsonp",  
  14.         jsonp: "callbackparam",//服务端用于接收callback调用的function名的参数  
  15.         jsonpCallback:"success_jsonpCallback",//callback的function名称  
  16.         success : function(json){  
  17.             alert(json.name);  
  18.         },  
  19.         error:function(a,b,c){  
  20.             alert(a+"++"+b+"++"+c);  
  21.         }  
  22.     });  
  23. }  
  24.   
  25. function success_jsonpCallback(){  
  26.     alert('back');  
  27. }  
  28. </script>  
  29.     </head>  
  30.     <body>  
  31.         <button id="go">  
  32.             gogogo  
  33.         </button>  
  34.     </body>  
  35. </html>  
上面是html代码。


看http://localhost/c.txt的返回:

success_jsonpCallback({"name":"zoer"})

上面这一行的返回数据。其中(之前的是回调函数的名字。后面的内容是返回数据。

用浏览器打开html,点击gogogo,就能alert出来zoer这个名字。

---------------------------------------------------------------------------------------------------

这里使用了jq的jsonp功能。看介绍:

如果获取的数据文件存放在远程服务器上(域名不同,也就是跨域获取数据),则需要使用jsonp类型。使用这种类型的话,会创建一个查询字符串参数 callback=? ,这个参数会加在请求的URL后面。服务器端应当在JSON数据前加上回调函数名,以便完成一个有效的JSONP请求。意思就是远程服务端需要对返回的数据做下处理,根据客户端提交的callback的参数,返回一个callback(json)的数据,而客户端将会用script的方式处理返回数据,来对json数据做处理。JQuery.getJSON也同样支持jsonp的数据方式调用。

---------------------------------------------------------------------------------------------------

好处:

能跨域取得数据。

坏处:

返回值的前面必须是回调函数的名字。所以远程函数必须能够提供这样的内容。

本站文章内容,部分来自于互联网,若侵犯了您的权益,请致邮件chuanghui423#sohu.com(请将#换为@)联系,我们会尽快核实后删除。
Copyright © 2006-2023 DBMNG.COM All Rights Reserved. Powered by DEVSOARTECH            豫ICP备11002312号-2

豫公网安备 41010502002439号