跨域:

一、什么是同源策略:

同源策略/SOP(Same origin policy)是一种约定,所谓同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。别人理解同源的意思就是,好比同一片区域的住户不能互相进入,就算是在同一栋小区,不同的房间号也是不可以进入了,除非是在同一个房间下的父母,兄弟姐妹才可以进入(也就是访问资源)。

二、解决跨域的方法有哪些?(共九种)

方式一:最简单也是最先想到的方式的就是通过服务端设置 ”Access-Control-Allow-Origin“,即修改响应头的方式。

方式二:通常为了减轻web服务器的负载,我们把js、css,img等静态资源分离到另一台独立域名的服务器上,在html页面中再通过相应的标签从不同域名下加载静态资源,而被浏览器允许,基于此原理,我们可以通过动态创建script,再请求一个带参网址实现跨域通信。凡是拥有src这个属性的标签都拥有跨域的能力。

对于前端而言,可以在地址中传递一个回调函数到服务器,服务器接到这个后,服务器将需要带的参数传递回来,这样一来一回,就可以解决跨域的问题。

方式三:在vue项目中,通过dev server代理实现,由于跨域是针对于浏览器的,以此我们可以通过由dev server将我们的数据发给服务器,服务器返回的数据先给dev server,相对于中间人帮忙转发。

其他方式:

nginx代理跨域;

document.domain + iframe跨域;

location.hash + iframe;

window.name + iframe跨域;

nodejs中间件代理跨域; 

WebSocket协议跨域

posted @ 2021-08-09 16:54  星空的轨迹  阅读(30)  评论(0)    收藏  举报