关于处理跨域问题的讨论

@GuoYongfeng 2018-05-30 03:19:44发表于 iuap-design/blog

1、通过 navigator.sendBeacon

适合上传少量数据,但是没法实现回调。

2、通过创建隐藏的 iframe 来发送数据

....

3、jsonp 来跨域

需要前后端约定,通过动态创建script实现。

4、xhr 2

“XHR2” 全称 “XMLHttpRequest Level2” 是HTML5提供的方法,对跨域访问提供了很好的支持,并且还有一些新的功能。

  • IE10一下的版本都不支持

  • 只需要在服务器端头部加上下面两句代码:

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

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

5. CORS跨域

6. postMessage跨域

这是html5的新API,适用于不同窗口iframe之间的跨域

7. window.name跨域

8. location.hash跨域

9. document.domain跨域

document.domain设置成自身或更高一级的父域,且主域必须相同。

10. 后端设置代理proxy跨域

因为JS同源策略是浏览器的安全策略,所以在浏览器客户端不能跨域访问,而服务器端调用HTTP接口只是使用HTTP协议,不会执行JS脚本,不需要同源策略,也就没有跨越问题。简单地说,就是浏览器不能跨域,后台服务器可以跨域。

11. WebSocket跨域

WebSocket是一种通信协议,使用ws://(非加密)和wss://(加密)作为协议前缀。该协议不实行同源政策,只要服务器支持,就可以通过它进行跨源通信。