js跨域请求的4种解决方式

跨域请求数据解决方案主要有如下解决方法：

• JSONP方式
• CROS
• window.name
• document.domain

JSONP方式:

我们知道html中script通过src属性可以引入其他域下的js，比如引入线上的jquery库。也可以引入非js的文件，利用这个特性，可实现跨域访问接口。该方法需要后端支持。

• 定义数据处理函数_fun
• 创建script标签，src的地址执行后端接口，最后加个参数callback=_fun
• 服务端在收到请求后，解析参数，计算返还数据，输出 fun(data) 字符串。
• fun(data)会放到script标签做为js执行。此时会调用fun函数，将data做为参数。

JSONP跨域不像下面的CORS跨域那样受同源政策的影响，而且兼容性也比较好，但JSONP跨域也有其缺点，主要表现在：

• 它支持 GET 请求而不支持 POST 等其它类行的 HTTP 请求。
• 它只支持跨域 HTTP 请求这种情况，不能解决不同域的两个页面或 iframe 之间进行数据通信的问题
• JSONP从其他域中加载代码执行，如果该域不安全并且夹带一些恶意代码，会存在安全隐患
• 要确定JSONP请求是否失败并不容易

CROS：

CORS 的全称是 Cross-Origin Resource Sharing，即跨域资源共享。他的原理就是使用自定义的 HTTP 头部，让服务器与浏览器进行沟通，主要是通过设置响应头的 Access-Control-Allow-Origin 来达到目的的。这样，XMLHttpRequest 就能跨域了。

相比之下，CORS 就支持所有类型的 HTTP 请求了，但是在兼容上面，往往一些老的浏览器并不支持 CORS。

window.name：

window.name 在一个窗口（标签）的生命周期之内是共享的，利用这点就可以传输一些数据

document.domain

在不同的子域 + iframe交互的时候，获取到另外一个 iframe 的 window对象是没有问题的，但是获取到的这个window的方法和属性大多数都是不能使用的。
这种现象可以借助document.domain 来解决。
这样，就可以解决问题了。值得注意的是：document.domain 的设置是有限制的，只能设置为页面本身或者更高一级的域名。
document.domain的后话：
利用这种方法是极其方便的，但是如果一个网站被攻击之后另外一个网站很可能会引起安全漏洞。