跨域是前端里一个比较重要的概念，在进行页面请求时没法绕过的一个概念。跨域是由于网络同源限制的一个解决方案。下面是个人的理解。
同源机制指的是一个脚本不可以请求与它不同域下的资源。这种机制是为了防止出现盗链（一个站点的网页引用其它网站的诸如图片的资源。）或者将银行网页挂到自己的网页上得到假的网银账户页面，以此窃取账户信息。
但是有很多情况需要跨域访问。存在着不同的跨域访问方法，这里简要介绍Jsonp和CORS两种。
Jsonp用来跨域获取json数据。Jsonp可以跨域是因为<script>标签中的src属性的url可以跨域访问，而且js原生支持json数据。这样我们就可以跨域调用包含json的js文件，来获取json数据。具体流程是动态建立一个script标签，标签内注册一个回调函数，函数内容为对
取得的数据的操作，然后把注册的函数的名字塞到src的url中传递给服务器，服务器将会把请求的json数据放到传来的函数名参数对应的函数参数中返回，这相当于返回一个函数的调用。最终结果是以服务器端的json数据为参数调用注册的函数。
1. <meta content="text/html; charset=utf-8" http-equiv="Content-Type" />
2. <script type="text/javascript">
3. function jsonpCallback(result) {
4. alert(result.a);
5. alert(result.b);
6. alert(result.c);
7. for(var i in result) {
8. alert(i+":"+result[i]);//循环输出a:1,b:2,etc.
9. }
10. }
11. </script>
12. <script type="text/javascript" src="http://crossdomain.com/services.php?callback=jsonpCallback"></script>
CORS的主要思想是在服务器端设置一个权限，对进来的请求判断是否拥有访问权限，对拥有访问权限的请求进行响应。 |
|
收藏
淘帖
踩
