隨着分布式微服務的興起，越來越多的公司在開發web項目的時候選擇前后端分離的模式開發，前后端分開部署，使得分工更加明確，徹底解放了前端。
我們知道，http請求都是無狀態，現在比較流行的都是jwt的形式處理無狀態的請求，在請求頭上帶上認證參數（token等），前后端分離有好處，也有壞處，第一次開發前后端分離項目的人，肯定會遇到前端請求
跨域的問題，這個怎么處理呢?在說處理方案前，有必要說明一下為什么會跨域和什么是跨域？
一、為什么會跨域？
出於瀏覽器的同源策略限制。
同源策略（Sameoriginpolicy）是一種約定，它是瀏覽器最核心也最基本的安全功能，如果缺少了同源策略，則瀏覽器的正常功能可能都會受到影響。可以說Web是構建在同源策略基礎之上的，瀏覽器只是針對同源策略的一種實現。同源策略會阻止一個域的javascript腳本和另外一個域的內容進行交互。所謂同源（即指在同一個域）就是兩個頁面具有相同的協議（protocol），主機（host）和端口號（port）
二、什么是跨域？
當一個請求url的協議、域名、端口三者之間任意一個與當前頁面url不同即為跨域
| 當前頁面url | 被請求頁面url | 是否跨域 | 原因 |
|---|---|---|---|
| https://www.52fansite.com/ | https://www.52fansite.com/index.html | 否 | 同源（協議、域名、端口號相同） |
| https://www.52fansite.com/ | http://www.52fansite.com/index.html | 是 | 協議不同（https/http） |
| https://www.52fansite.com/ | https://www.baidu.com/ | 是 | 主域名不同（52fansite/baidu） |
| https://www.52fansite.com/ | https://layui.52fansite.com/ | 是 | 子域名不同（www/layui） |
| https://www.52fansite.com:8080/ | https://www.52fansite.com:8081/ | 是 | 同源（協議、域名、端口號相同） |
三、處理跨域
1、在controller的類上或方法上添加注解
1.1類上加注解
@RestController
@CrossOrigin(origins = "*")
public class CorsController {
@GetMapping("/cors")
public String testCors() {
return "success";
}
}
1.2方法上加注解
@RestController
public class CorsController {
@CrossOrigin(origins = "*")
@GetMapping("/cors")
public String testCors() {
return "success";
}
}
2、在啟動類配置全局cors(springboot2.0已經過時)
@SpringBootApplication
public class Application {
public static void main(String[] args) {
SpringApplication.run(Application.class, args);
}
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurerAdapter() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/*").allowedOrigins("*");
}
};
}
}
替換為
@SpringBootApplication
public class Application {
public static void main(String[] args) {
SpringApplication.run(Application.class, args);
}
@Bean
public WebMvcConfigurer corsConfigurer() {
return new WebMvcConfigurer() {
@Override
public void addCorsMappings(CorsRegistry registry) {
registry.addMapping("/*").allowedOrigins("*");
}
};
}
}
3、注冊corsFilter
@Configuration
public class CorsConfig {
@Bean
public CorsFilter corsFilter() {
final UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
final CorsConfiguration config = new CorsConfiguration();
config.setAllowCredentials(true);
config.addAllowedOrigin("*");
config.addAllowedHeader("*");
config.addAllowedMethod("*");
source.registerCorsConfiguration("/**", config);
return new CorsFilter(source);
}
}