每个接触前端的人都会遇到前端经典跨域问题，下面介绍几种我所知道的跨解决方法
1.首先什么是跨域？
即为不同域名之间相互访问
2.那什么是不同域呢？
只要协议名，域名，端口号，任一不同则为不同域
解决方法：
1.Jsonp:利用<script>标签的src属性实现
script中src可以跨域加载别的域中文件
实现方法：
创建一个回调函数，然后在远程服务上调用这个函数并且将JSON 数据形式作为参数传递，完成回调。
将JSON数据填充进回调函数
例：
//a.com
<script src="http://www.b.com/test.php?name=lisi&callback=aaa"></script>
在b.com中的test.php中可以接收传递过来的参数name还有callback，然后执行：
b.com中执行回调函数的调用echo 'callback(要回传给a.com的数据)'
缺点：只能进行get请求，不支持post请求
2.服务器端代理：
服务器端是没有跨域问题的
3.CORS（跨域资源共享）
基本思想：使用自定义的http 请求头让浏览器和服务器进行沟通
将XHR对象的URL从相对路径变为别的域下的绝对路径
要使服务器端对CORS进行支持，需要设置Access-Control-Allow-Origin
如果浏览器检测到相应设置，允许Ajax进行跨域访问
4.document.domain
只适用于不同子域的框架间交互
实现方法：将两个页面的document.domain设置为相同域名
document.domain只能设置自身或更高级的父域，且主域必须相同
document.domain=“”
5.window.name+iframe
window.name特征：在一个窗口声明周期内，窗口载入的所有文件都是共享一个window.name的
每个页面都有读写权利
主要实现需要三个页面
a.com/app.html
a.com/proxy.html(代理文件)
b.com/data.html
首先在a.com/app.html 创建一个iframe 使其src指向数据页面，数据页面会把数据附加到iframe的window.name上
然后在应用页面监听iframe.onload事件，在事件中设置iframe的src属性指向本地域代理文件
获取数据后销毁iframe
网友评论