前端常见跨域解决方案


1.什么是跨域?

跨域是由浏览器同源策略引起的,是指页面请求的接口地址,必须与页面url地址处于同域上(即域名,端口,协议相同)。


2.什么是同源策略?

同源策略/SOP(Same origin policy)是一种约定,由Netscape公司1995年引入浏览器,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,浏览器很容易受到XSS、CSFR攻击

***同源是指"协议+域名+端口"三者相同,即便两个不同的域名指向同一个ip地址,也非同源。

同源策略限制的几种行为:

1.) Cookie、LocalStorage 和 IndexDB 无法读取

2.) DOM 和Js对象无法获得

3.) AJAX 请求不能发送


3.跨域问题解决方案

1.) 通过jsonp跨域

2.) document.domain + iframe跨域

3.) location.hash + iframe

4.) window.name + iframe跨域

5.) postMessage跨域

6.) 跨域资源共享(CORS)

7.) nginx代理跨域

8.) nodejs中间件代理跨域

9.) WebSocket协议跨域

方案详解:https://segmentfault.com/a/1190000011145364


webpack配置proxy反向代理,解决跨域问题

https://www.jianshu.com/p/81147bb65c55


Chrome设置跨域访问

目标路径的后面添加【 --disable-web-security】

若加上 --disable-web-security后不生效,方法:https://blog.csdn.net/duansamve/article/details/108310403


最后编辑于
©著作权归作者所有,转载或内容合作请联系作者
【社区内容提示】社区部分内容疑似由AI辅助生成,浏览时请结合常识与多方信息审慎甄别。
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

相关阅读更多精彩内容

  • 一、什么是跨域? 在前端领域中,跨域是指浏览器允许向服务器发送跨域请求,从而克服Ajax只能同源使用的限制。 什么...
    候鸟与暖风阅读 3,952评论 0 2
  • 作者:安静de沉淀https://segmentfault.com/a/1190000011145364 什么是跨...
    layjoy阅读 5,098评论 1 8
  • 我是黑夜里大雨纷飞的人啊 1 “又到一年六月,有人笑有人哭,有人欢乐有人忧愁,有人惊喜有人失落,有的觉得收获满满有...
    陌忘宇阅读 12,755评论 28 53
  • 信任包括信任自己和信任他人 很多时候,很多事情,失败、遗憾、错过,源于不自信,不信任他人 觉得自己做不成,别人做不...
    吴氵晃阅读 11,358评论 4 8
  • 步骤:发微博01-导航栏内容 -> 发微博02-自定义TextView -> 发微博03-完善TextView和...
    dibadalu阅读 8,430评论 1 3

友情链接更多精彩内容