飞嗨,欢迎您的光临,本博所发布之文章皆为作者亲测通过,如有错误,欢迎通过各种方式指正。(本博已于2015.12.6升级到php7,运行环境php7 php-fpm + nginx1.8.0)

js跨域

Node.js/JS lf 1282℃ 0评论

检讨一下自己,很久很久没有写博客了,上一篇文章还是本月1号写的,今天都20号了。不过,也要为自己辩驳一下,这段时间以来确实很忙很忙很忙,忙的不可开交。于本月9号辞职,10号上午面试了两家公司,两个offer都拿到了,然后就没有继续面试了,于13号去了新公司上班。辞职前,各种忙收尾,公司业务转java了,php也不会再招人了,各种忙。13号去新公司呢,商城预计8月份上线,现在项目初期的不能再初期了,忙啊忙。不过,现在又要坐地铁上下班,估计是没法保证一天一更了,尽量保持一天一更吧,两天一更一定是要的。

今天,开辟了javascript目录,换这份工作期间,深深的感受到了javascript的重要性,且不说node.js有取代php之势,公司一般不愿意请个专门的js人员,要么ui附带了,要么得后端附带了。之前,也会写一些简单的js,用的最多的还是jquery操作dom还好,但是,作为web开发人员,对于前端js,还是很应该有一个更好的掌握。当然了,抽空还要看看编译原理、计算机工作原理、数据结构等基础的知识,这些对于长期发展真是太重要了。

对于js跨域,很早以前我就遇到了,那时在用新浪微博sdk的时候,为毛要通过服务器端的php sdk代理,直接用js请求open.weibo.com不就好了吗。不过,当我用jquery ajax后,alert值竟然是空的。那个时候不知道是为什么,后来找资料知道是跨域引起的。

javascript由于语言安全限制中的同源策略造成的跨域问题,js脚本只能读取来自同一来源的窗口和文档的属性,及主机名、协议和端口号都要相同。好在,html dom中,script标签是可以跨域访问服务器上的数据,因此,解决js跨域可以通过指定script src属性为跨域url,从而实现跨域访问。如在www.a.com下的<script src=’http://www.b.com/’></script>,这里对返回的数据有个要求,如果服务器单纯的输出json字符串,是没法引用的。可以返回var data = xxx或者fun(xxx),当然,在采取第二种调用函数中,还应该建立fun函数。

实现的原理就是这样的,但是,jquery已经封装好了,直接使用jsonp就可以让jquery去创建script标签啦。
客户端js:

js跨域

js跨域

<script>
$.ajax({
type:’get’,
async:false,
url:’http://blog.f.com/a.php’,
dataType:’jsonp’,
jsonp:’callback’,
success:function(data){
alert(data);
}
})
function jsonpCallback(data){
alert(data.message);
}
</script>

服务器端返回:

js跨域php端

js跨域php端

<?php
$data[‘success’] = ‘1’;
$data[‘message’] = ‘eeeeeee';
$data = json_encode($data);
echo ‘jsonpCallback(‘.$data.’)';

运行结果:

js跨域

js跨域

其实,一开始的时候,我刷新,确实也看到了跨域得回来的json数据,但是就是不会alert返回的值,用chrome console看到,js报语法错误!!!这里一定要注意,应该返回jsonp,而不是json,在服务器端返回的时候,一定要返回一个客户端js已经存在的方法,而不是单纯的json字符串。ok,javascript跨域完成。

啊呀,第一篇js写的好乱,可能是因为有些术语不知道,不知怎么表达造成的吧,是需要加强!

转载请注明:飞嗨 » js跨域

喜欢 (0)or分享 (0)
发表我的评论
取消评论
表情
粤ICP备15018643号-1