跨域的解决办法

#什么是跨域？
 在前端领域中，跨域是指浏览器允许向服务器发送跨域请求，从而克服Ajax只能同源使用的限制。
##什么是同源策略？
  同源策略是一种约定，由Netscape公司1995年引入浏览器，它是浏览器最核心也最基本的安全功能，如果缺少了同源策略，浏览器很容易受到XSS、CSFR等攻击。所谓同源是指"协议+域名+端口"三者相同，即便两个不同的域名指向同一个ip地址，也非同源。

同源策略限制以下几种行为：

Cookie、LocalStorage 和 IndexDB 无法读取
DOM和JS对象无法获得
AJAX 请求不能发送

###跨域的解决办法
（1）JSONP

JSONP 是服务器与客户端跨源通信的常用方法。最大特点就是简单适用，兼容性好（兼容低版本IE），缺点是只支持get请求，不支持post请求。

核心思想：网页通过添加一个

<script src="http://test.com/data.php?callback=dosomething"></script>
// 向服务器test.com发出请求，该请求的查询字符串有一个callback参数，用来指定回调函数的名字

// 处理服务器返回回调函数的数据
<script type="text/javascript">
    function dosomething(data){
        //处理获得的数据
    }
</script>

（2）CORS

CORS 是跨域资源分享（Cross-Origin Resource Sharing）的缩写。它是 W3C 标准，属于跨源 AJAX 请求的根本解决方法。

1.前端代码（需要判断浏览器是否支持情况）

 1 function createCORSRequest(method, url) {
 2   var xhr = new XMLHttpRequest();
 3   if ("withCredentials" in xhr) {
 4 
 5     // 此时即支持CORS的情况
 6     // 检查XMLHttpRequest对象是否有“withCredentials”属性
 7     // “withCredentials”仅存在于XMLHTTPRequest2对象里
 8     xhr.open(method, url, true);
 9  
10   } else if (typeof!= "undefined") {
11  
12     // 否则检查是否支持XDomainRequest，IE8和IE9支持
13     // XDomainRequest仅存在于IE中，是IE用于支持CORS请求的方式
14     xhr = new XDomainRequest();
15     xhr.open(method, url);
16  
17   } else {
18  
19     // 否则，浏览器不支持CORS
20     xhr = null;
21  
22   }
23   return xhr;
24 }
25  
26 var xhr = createCORSRequest('GET', url);
27 if (!xhr) {
28   throw new Error('CORS not supported');
29 }