js跨域

1、什么是跨域？

因为浏览器的同源策略（协议、域名、端口）限制。浏览器不能够直接进行跨域访问，只有img、script、iframe等这类可以指定src属性的标签有跨域获取别人网站上数据的能力。
至于为什么要这样限制，主要还是为了安全考虑，避免恶意网站获取正常网站的数据。

2、实现跨域的方法

2.1服务器代理
浏览器有跨域限制，但是服务器就不存在跨域问题，可以让服务器请求所要域的资源，再返回给客户端。
2.2：jsonp实现跨域

基本原理就是通过动态创建script标签,然后利用src属性进行跨域。

    // 定义一个fun函数
    function fun(fata) {
        console.log(data);   //获取的 数据
     };
    // 创建一个脚本，并且告诉后端回调函数名叫fun
    var body = document.getElementsByTagName('body')[0];
    var script = document.createElement('script');
    script.type = 'text/javasctipt';
    script.src = 'demo.js?callback=fun';
    body.appendChild(script);

    fun({data:'yourdata'})   //服务器 返回的数据类似这样

自己传函数名（如：fun）都是那些牛逼哄哄的开发者想到的，这样不同的人调用可以执行不同本地函数，但是取的数据是一样的，后台返回的代码是动态生成的。
返回的js脚本，会立即执行。然后我们又刚好事先定义好了 fun函数，fun函数里面的data就是取过来的数据，所以我们就可以愉快的处理返回回来的数据了。
在实际使用的时候，我们用的各种ajax库（如：Jquery），基本都包含了jsonp的封装，看看这些库的文档基本都找的到。
实际上用src属性请求数据就是一个get请求，所以jsonp不能获取 post请求才能获取的数据。
参考 知乎关于跨域回答 IoveC博客

2.1：CORS 实现跨域

CORS是一个W3C标准，全称是"跨域资源共享"（Cross-origin resource sharing）。
CORS需要浏览器和服务器同时支持。目前，所有浏览器都支持该功能，IE浏览器不能低于IE10。
整个CORS通信过程，都是浏览器自动完成，不需要用户参与()。对于开发者来说，CORS通信与同源的AJAX通信没有差别，代码完全一样。浏览器一旦发现AJAX请求跨源，就会自动添加一些附加的头信息，有时还会多出一次附加的请求，但用户不会有感觉。
如果要带cookie过去 只需要设置 xhr.withCredentials = true;

CORS与JSONP的使用目的相同，但是比JSONP更强大。
JSONP只支持GET请求，CORS支持所有类型的HTTP请求。JSONP的优势在于支持老式浏览器，以及可以向不支持CORS的网站请求数据，jsonp更加广泛。

参考 阮一峰cors详解