好贷网好贷款

js跨域问题_跨域请求数据_jQuery跨域

发布时间:2016-12-4 12:05:56 编辑:www.fx114.net 分享查询网我要评论
本篇文章主要介绍了"js跨域问题_跨域请求数据_jQuery跨域",主要涉及到js跨域问题_跨域请求数据_jQuery跨域方面的内容,对于js跨域问题_跨域请求数据_jQuery跨域感兴趣的同学可以参考一下。

前两天跟一个朋友谈到跨域的问题,对于跨域,搞清原理,其实感觉应该是一个很简单的东西,理理思路,往下阅读这篇文章吧....js跨域之概念:所谓跨域,那么到底什么是跨域呢?打个比方,用js加载本域名的数据是没有问题的,那么我想加载另外一个域名下的东西行不行呢?答案是不行的,为什么呢?因为javacript::同源策略的限制,yangyf.com域名下的js是无法请求yangyanfei.com或是a.yangyf.com域名下的数据的,请看下面一组数据: URL 说明 是否允许通信 http://www.a.com/a.jshttp://www.a.com/b.js 同一域名下 允许 http://www.a.com/lab/a.jshttp://www.a.com/cript:/b.js 同一域名下不同文件夹 允许 http://www.a.com:8000/a.jshttp://www.a.com/b.js 同一域名,不同端口 不允许 http://www.a.com/a.jshttps://www.a.com/b.js 同一域名,不同协议 不允许 http://www.a.com/a.jshttp://70.32.92.74/b.js 域名和域名对应ip 不允许 http://www.a.com/a.jshttp://cript:.a.com/b.js 主域相同,子域不同 不允许 http://www.a.com/a.jshttp://a.com/b.js 同一域名,不同二级域名(同上) 不允许(cookie这种情况下也不允许访问) http://www.b.com/a.jshttp://www.a.com/b.js 不同域名 不允许对跨域有个大致的了解之后,那么我们究竟该如何去实现跨域呢?好,我们耐着性子往下读哈....既然我们不能直接请求其他域名下的数据,但是利用cript:标签的src属性请求别的js文件是完全没有问题的哦~好吧,我们试试这个神秘的src看看它是怎么实现跨域的。我们这么想,我想在页面加载完成之后,然后再js加载一部分数据,而且这部分数据是来自其他域名,那么我们怎么才能让js拿到这部分数据,现在我假设已经拿到这一组数据了,这组数据是用自定义的一个js函数获取的,看下面的简单的例子:function getCallBackData(json){//这个json,我们暂且让它为json简易对象数据,假如数据{id:1,name:"yangyanfei",age:22} 遍历一下这组数据吧for(var i in json){ alert:(json); }}这是我们在客户端定义好的一个函数,我们事先约定好,我需要一个json对象,然后有id,name,age属性可能有人要问了,这跟跨域有关系吗?我现在告诉你,非常的有关系~~~我们想吧,我用cript:标签的src属性去请求一个其他域名下的文件,如果这个文件给我返回一个getCallBackData({id:1,name:"yangyanfei",age:22});是不是很刺激?是不是很有感觉?在看看getCallBackData({id:1,name:"yangyanfei",age:22});在客户端的时候,是不是执行了上面我们定义的函数了....自己去悟吧~~~~其实跨域就是我们利用cript:标签的src属性链接其他的域名,比如yangyanfei.com/index.php?callback=callback【这个参数值对可以任意写,但有一点要注意,你的值写什么,你的回调函数名必须写什么】为什么会这么说呢?你想呀,index.php接受到callback这个参数值后,要返回这个值也就是 callback({id:1,name:"yangyanfei",age:22})如果你这个参数值和你定义的js回调函数不一样,它怎么执行呢?对不对~~~~~~~~~理论扯多了?不新鲜?我们换种方式,在刺激一下....跨域实战↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓↓实战一:[原生版]文件说明:yangyanfei.com域名下有一个文件test.php[客户端] yangyf.com域名下有一个文件server.php[服务端]需求说明:test.php文件里面有一个按钮,再点击的时候,需要从server.php文件上取数据具体代码截图信息test.php页面部分截图信息[当前页面所在域名为yangyanfei.com] 这段代码没什么还说的,大家可以看到这个按钮的点击事件,是执行一个js函数,参数为一个网址仔细看这个网址是yangyf.com,很明显有一个参数值对,名为callback值为callback,那么这个add_cript:Tag()是干嘛的呢?请看截图.... test.php页面部分截图信息[当前页面所在域名为yangyanfei.com] 我们从这个add_cript:Tag可以看出,这个函数主要创建一个cript:标签,src属性为你提供的网址,下面那个callback函数,我们暂且放这里..... 客户端准备完了,那么yangyf.com这台服务器该怎么准备呢?好了,我们一起去看看这台服务器的处理程序吧... server.php页面部分截图[当前页面所在域名为yangyf.com] 哇,这个文件也太简单了吧.... 不是说了吗?我们约定好的,我需要一个json格式对象数据,在看看第三行是什么?$_GET['callbak']."(".$data.")"; 我们分析一下它,还记得test.php页面创建cript:标签的网址吗?还记得参数吗?没记着看看第一张图片哦,这个参数值对是callback=callbak 那么这里的$_GET['callbak']."(".$data.")";是什么呢?答案是:callback({id:1,name:"yangyanfei",age:22}); 这里PHP认为这就是一个普普通通的字符串呗,有什么的,你敢echo,我就敢把callback({id:1,name:"yangyanfei",age:22})给你扔给请求者.... 我们再回过头看看刚才遗留的一个小问题,刚才不是说到有个问题要后面讲吗?看第二张图片里面的定义的callback函数..懒得往上翻?好吧,我在截图给你看..... test.php页面部分截图信息[当前页面所在域名为yangyanfei.com] server.php 文件把callback({id:1,name:"yangyanfei",age:22})东西扔到客户端去了,而浏览器可不管,看到 callback({id:1,name:"yangyanfei",age:22}) 就当js函数执行了...... 这样,一个原生的跨域请求就结束了...怎么样?了解跨域了吧?有人会问到,那么多的代码,多麻烦啊!!!好吧,jQuery为我们早已准备了一个函数,一起来体验jQuery版的跨域请求吧... 实战一:[jQuery版] test.php页面部分截图信息[当前页面所在域名为yangyanfei.com] test.php页面部分截图信息[当前页面所在域名为yangyanfei.com] 其实jQuery版的跨域更方便一点,里面的ajax方法,想必大家特别的熟悉,那么这里需要注意一点,dataType的类型需要设置为jsonp,为什么呢?如果不设置为jsonp,那么默认不会走跨域请求的,这里还可以自定义参数名,设置jsonp的值即可,服务端需要接收这个参数名..那么成功后会把数据放到success对应的匿名函数的参数e里... server.php页面部分截图[当前页面所在域名为yangyf.com] 跟上面的完全一样哈..... ↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑↑ 好了~~~关于跨域问题,就说这么多吧~~~板砖有木有!~~~~原文地址:http://bbs.lampbrother.net/read-htm-tid-121961.html 管理员在2009年8月13日编辑了该文章文章。 --> --> 阅读(49) | 评论(0) | 转发(0) | 0 上一篇:样儿的项目感受 下一篇:5个月,给自己一个未来 相关热门文章 《数字技术与应用》征稿**投稿... 寻求靓机Agilent E4402b高价回... 美国RT服务器租用仿牌网站不二... 8500WN智能网卡曝光 强悍配置... text段,data段,bss段,堆和栈 ... 毕业五年(续) 毕业五年 职业生涯规划 中国软件开发工程师之痛... 闲置书处理! 大家都是用什么来管理hadoop集... 网站被人挂了吗,添加了些程序... Nginx如何保证不走宕机的那个... 大家谈谈MYSQL客户端和服务器... 以下代码运行后为何会输出5?... 热门推荐 --> 给主人留下些什么吧!~~ 评论热议

上一篇:样儿的项目感受
下一篇:以太网相关知识

相关文章

相关评论