跨域问题浅析

最新推荐文章于 2021-11-27 17:07:59 发布

断然Juvenile

最新推荐文章于 2021-11-27 17:07:59 发布

阅读量197

点赞数 1

分类专栏： Java:从入门到放弃 H5

本文链接：https://blog.csdn.net/qq_44265507/article/details/103211854

版权

33 篇文章 2 订阅

订阅专栏

3 篇文章 0 订阅

订阅专栏

今天与前端臭妹妹前后端连调时，偶遇到这个错误，百度求解之，乃为跨域问题

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-r3p8xj25-1574478389731)(H:\md\图片\浅析跨域问题\image-20191121205014937.png)]$

跨域指的是浏览器不能执行其它网站的脚本，它是由浏览器的同源策略造成的，是浏览器对JavaScript 施加的安全限制。
同源策略又是什么呢？
- 协议、域名、端口号都相同，只要有一个不相同，那么都是非同源。
$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-IVAGYcXV-1574478389732)(H:\md\图片\浅析跨域问题\image-20191121205305991.png)]$

浏览器在执行脚本的时候，都会检查这个脚本属于哪个页面，即检查是否同源，只有同源的脚本才会被执行；而非同源的脚本在请求数据的时候，浏览器会报一个异常，提示拒绝访问。
同源策略的限制情况

Cookie、LocalStorage 和 indexDB 无法读取
Dom 和 js 对象无法获得
Ajax 请求不能发送（即我今天遇到的问题）

特例：
- 对于像 img、iframe、script 等标签的 src 属性是特例，它们是可以访问非同源网站的资源的

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-zUlzS8XY-1574478389733)(H:\md\图片\浅析跨域问题\image-20191121210805947.png)]$

即此时客户端1 访问tomcat2 项目，通过ajax请求 tomcat1的资源即是出现了浏览器跨域问题！

这是网上，最为常见的方法了，即是在响应头中，设置允许不同源访问，例如

$[外链图片转存失败,源站可能有防盗链机制,建议将图片保存下来直接上传(img-3YrBgJUV-1574478389736)(H:\md\图片\浅析跨域问题\image-20191121210601389.png)]$

具体实现方法，就不在此赘述了，写一下其大体实现原理：

具体实现方法，就不在此赘述了，写一下其大体实现原理：

在后台代码中，去访问某资源，得到资源，然后再把资源传给前端，即绕过了浏览器的同源策略

利用nginx反向代理，将请求分发到部署到相应项目的tomcat服务器，当然也不存在跨域问题。

关注