前端跨域方案 – Python量化投资

前端跨域方案

为什么需要跨域

因为浏览器的同源策略(同协议,同域名,同端口),类似只能在自己的国家了到处旅行,如果去国外就得需要护照。

方法

jsonp

原理:
就是通过script的自己可以跨域的功能,自己定义一个函数,然后让后端把函数的带着参数的执行返回,再在前端执行。
缺点:
只能get

document.domain

原理:
既然是同源策略,如果两个html的域名一样就可以了,通过document.domain设置域名。
缺点:
主域名必须相同的情况下才能使用

window.name + iframe

利用window.name 可以跨域,先请求不同域的,改变window.name,然后转成自己域名下,获取window.name
缺点:
麻烦,window.name大小限制在2M

postMessage

使用html5的postMessage来互相传递消息

跨域资源共享(CORS)

普通跨域请求:只服务端设置Access-Control-Allow-Origin即可,前端无须设置,若要带cookie请求:前后端都需要设置
// 前端设置是否带cookie
xhr.withCredentials = true;
原理:
就是通过放开同源设置,让前端可以跨域请求接口

nginx代理跨域(node中间件同理)

原理:
nginx就是一个服务器,同样客户设置同源策略规则
Access-Control-Allow-Origin *
利用nginx的反向代理到域名下,因为后端没有同源策略限制。

WebSocket协议跨域

原理:
WebSocket协议跨域自带跨域属性。

总结

1, 利用前端自带跨域的
jsonp, document.domain, window.name,postmessage
2, 利用服务器配置
nginx,cors,node中间件
3,利用协议自带跨域
WebSocket协议跨域自带跨域属性。

https://juejin.im/post/5d6c810af265da03e16890b5

「点点赞赏,手留余香」

    还没有人赞赏,快来当第一个赞赏的人吧!
0 条回复 A 作者 M 管理员
    所有的伟大,都源于一个勇敢的开始!
欢迎您,新朋友,感谢参与互动!欢迎您 {{author}},您在本站有{{commentsCount}}条评论