2025年什么是跨域以及解决方法(什么是跨域?怎么解决跨域问题?)

什么是跨域以及解决方法(什么是跨域?怎么解决跨域问题?)在和前端联调的时候 时不时的就会冒出一个跨域问题 如下所示 浏览器为了页面安全 设置了同源策略 即本域脚本只能读写本域内的资源 而无法访问其它域的资源 所谓同源就是 协议 域名 端口 三者相同 当在一个站点内访问非该同源的资源 浏览器就会报跨域错误 浏览器的两种同源策略会造成跨域问题 同源策略是浏览器的行为 所以不要再说我自己调接口调通了啊或者我用 PostMan 调没有问题啊

大家好,我是讯享网,很高兴认识大家。



在和前端联调的时候,时不时的就会冒出一个跨域问题,如下所示:

浏览器为了页面安全,设置了同源策略:即本域脚本只能读写本域内的资源,而无法访问其它域的资源。所谓同源就是“协议+域名+端口”三者相同,当在一个站点内访问非该同源的资源,浏览器就会报跨域错误。浏览器的两种同源策略会造成跨域问题:

同源策略是浏览器的行为,所以不要再说我自己调接口调通了啊或者我用PostMan调没有问题啊。

新建2个SpringBoot项目:A和B。A端口8080,B端口8081。

项目A建一个AController

项目B建立static/index.html

然后启动项目后访问localhost:8081/index.html,点击button会触发跨域。

跨域网上有很多解决方法,我只说说一些常用的。跨域问题,不仅仅是前端的事情,也是后端的事情。传统的跨域方案是JSONP,但是JSONP只支持GET请求。我们后端目前都是用的CORS来解决跨域的。

什么是CORS

CORS是一个W3C标准,全称是“跨域资源共享”(Cross-origin resource sharing)。 它允许浏览器向跨源服务器,发出XMLHttpRequest请求,从而克服了AJAX只能同源使用的限制。

CORS需要浏览器和服务端同时支持,即浏览器和服务端都需要有对应的技术支撑才能使用CORS。

CORS原理

浏览器将CORS请求分成两类:简单请求和非简单请求。针对这2种不同的请求浏览器的请求流程不同。

Tips: 满足下面2个条件的就就是简单请求:


讯享网

1. 请求方法是以下三种方法之一

2. HTTP的头信息不超出以下几种字段:

简单请求流程:

3. 浏览器依据返回的有没有这个Header来判断是否出错。

非简单请求流程:(比如请求方法是PUT或DELETE,或者Content-Type字段的类型是application/json。)

使用

Spring和SpringBoot都堆CORS提供了支持,下面说说SpringBoot是怎么做的:

1. 使用@CrossOrigin(origins = “http://localhost:8081")注解,可以注解在Controller方法上,表示这个接口允许跨域。也可以注解在Class上,表示该Controller下面所有的接口都支持该跨域。

2. 如果很多地方都需要处理这么就很麻烦了,我们可以使用WebMvcConfigurerAdapter来全局做配置。

3. 还可以使用Filter也是可以的,我用的不多,就不写了。

这么写了并不是就安全了,存在CSRF危险。浏览器在实际操作中,会对请求进行分类,分为简单请求,预先请求,带凭证的请求等,预先请求会首先发送一个options探测请求,和浏览器进行协商是否接受请求。默认情况下跨域请求是不需要凭证的,但是服务端可以配置要求客户端提供凭证,这样就可以有效避免csrf攻击。

小讯
上一篇 2025-05-27 10:42
下一篇 2025-04-15 16:18

相关推荐

版权声明:本文内容由互联网用户自发贡献,该文观点仅代表作者本人。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如发现本站有涉嫌侵权/违法违规的内容,请联系我们,一经查实,本站将立刻删除。
如需转载请保留出处:https://51itzy.com/kjqy/163942.html