跨域

2016-03-20

在讲跨域之前就先讲讲域名，什么是域名以及域名的组成：

百度百科是这么定义域名的：

域名（Domain Name），是由一串用点分隔的名字组成的Internet上某一台计算机或计算机组的名称，用于在数据传输时标识计算机的电子方位（有时也指地理位置，地理上的域名，指代有行政自主权的一个地方区域）。域名是一个IP地址上有“面具” 。比如百度的域名为：http://www.baidu.com,新浪的域名是http://www.sina.com.

上了上面的域名定义，那么就说说域名主要的组成：

用下面的域名作为例子：

http://www.baidu.com:8080/scripts/jquery.js

其中http://就是协议 

www为子域名

baidu.com为主域名

8080端口号

scripts/jquery.js请求资源地址

那么什么叫不同域？

不同域就是当上述中的 协议、子域名、主域名、端口号中任意的一个不相同时，都算作不同域

而跨域就是：不同域之间相互请求资源，就是跨域

比如：http://www.baidu.com/index.html请求http:/www.sina.com/js.php就是跨域请求

javascript出于安全方面的考虑，步允许跨域调用其他页面的对象，什么是跨域？简单理解即使因为javascript同源策略的限制，即baidu.com域名下的js无法操作sina.com域名下的对象。

那么要实现跨域怎么办？

第一种办法~代理~

即通过在同域的web服务器短创建一个代理：

比如深圳的服务器 域名：www.shenzhen.com

　　广州的服务器 域名： www.guangzhou.com

那么要使用深圳的服务响应广州的服务怎办呢？

办法就是 在深圳的web服务器的后台

　　www.shenzhen.com/proxy-guangzhouservice.php来调用上海的服务器

　　www.guangzhou.com/service.php的服务器，然后再把响应结果返回给前端，这样前端调用深圳的域名服务器就和用广州的服务器效果一样了。

第二种办法~jsonp

　　使用jsonp可以解决主流浏览器get请求的数据跨域访问

在www.aaa.com叶敏中：

js代码：

function jsonpData(json){

console.log(json["name"]);

}

并引入<script src="http://www.bbb.com/jsonp.js"<</script>

在www.bbb.com页面中：

jsonp({

"name":"张三",

"sex":"男";

});

即bbb.com的域名去声明aaa.com去调用；

记住jsonp的方法只支持get请求对post前请求是不支持的。

第三种办法：XHR2

html5中提供了XMLHttpRequest Level2中已实现了跨域访问以及其他的一些新功能

但是对于IE10一下的版本不支持

在服务器短做一些小小的改造即可实现xhr2的跨域请求

header("Access-Control-Allow-Origin:*");

header("Access-Control-Allow-Methods:POST,GET");