SpringBoot解决跨域问题
作者:互联网
一、引言
现在的项目很多都是前后端分离的项目,方便升级,也方便开发。那么前端项目访问后台服务就会出现下面这个问题,跨域。
那什么是跨域呢?
跨域,指的是浏览器不能执行其他网站的脚本,它是由浏览器的同源策略造成的,是浏览器施加的安全限制。
所谓同源是指,域名,协议,端口均相同,看下示例:
当前页面url | 被请求页面url | 是否跨域 | 原因 |
---|---|---|---|
http://www.scorpios.com/ | http://www.scorpios.com/index.html | 否 | 同源(协议、域名、端口号相同) |
http://www.scorpios.com/ | https://www.scorpios.com/index.html | 跨域 | 协议不同(http/https) |
http://www.scorpios.com/ | http://www.baidu.com/ 跨域 | 主域名不同 | (scorpios/baidu) |
http://www.scorpios.com/ | http://blog.scorpios.com/ 跨域 | 子域名不同 | (www/blog) |
http://www.scorpios.com:8080/ | http://www.scorpios.com:7001/ | 跨域 | 端口号不同(8080/7001) |
注意:localhost和127.0.0.1虽然都指向本机,但也属于跨域。
浏览器执行javascript脚本时,会检查这个脚本属于哪个页面,如果不是同源页面,就不会被执行。
二、SpringBoot中解决跨域的两种方式
那么在后台该如何解决跨域问题呢?这要分为两种情况,第一种情况是独立微服务,第二种情况就是多微服务。
1. 独立微服务
对于这种情况,处理方法比较简单,只需要在每个Controller
上加上一个支持跨域的注解:@CrossOrigin
@CrossOrigin
@RestController
public class HomeController{
@RequestMapping(path="/home")
public String home() {
return "home";
}
}
2. 多微服务
如果有多个微服务,就需要在网关gateway
中配置支持跨域的配置。
@Configuration
public class CustomCorsConfiguration {
@Bean
public CorsWebFilter corsWebFilter(){
UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
CorsConfiguration corsConfiguration = new CorsConfiguration();
//1、配置跨域
corsConfiguration.addAllowedHeader("*");
corsConfiguration.addAllowedMethod("*");
// corsConfiguration.addAllowedOrigin("*");
corsConfiguration.addAllowedOriginPattern("*");
corsConfiguration.setAllowCredentials(true);
source.registerCorsConfiguration("/**",corsConfiguration);
return new CorsWebFilter(source);
}
}
上面就是两种在后台解决跨域问题的方法。
三、前端解决跨域的方式
在前端的话,有和方式呢?
- 正常情况下,可以用
nginx
做反向代理 - 如果使用一些框架的话,比如
vue-admin-template
,可以在框架中配置代理,是支持的
标签:www,http,SpringBoot,corsConfiguration,scorpios,解决,com,跨域 来源: https://blog.csdn.net/zxd1435513775/article/details/121446153