解决跨域问题
0、浏览器跨域问题
看到浏览器报Access-Control-Allow-Origin毫无疑问了,看来是跨域问题
CORS是一种访问机制,英文全称是Cross-Origin Resource Sharing,即我们常说的跨域资源共享,通过在服务器端设置响应头,把发起跨域的原始域名添加到Access-Control-Allow-Origin 即可
浏览器端:发送AJAX请求前需设置通信对象XHR的withCredentials 属性为true。
服务器端:设置Access-Control-Allow-Credentials为true。
两个条件缺一不可,否则即使服务器同意发送Cookie!
Access-Control-Allow-Methods
表示允许哪些跨域请求的提交方式。(例如GET/POST)
Access-Control-Allow-Headers
表示跨域请求的头部的允许范围。
Access-Control-Expose-Headers
表示允许暴露哪些头部信息给客户端。
Access-Control-Max-Age
表示预检请求的最大缓存时间。
1、返回新的CorsFilter
这是一种全局跨域的方式
在任意配置类,返回一个新的CorsFilter Bean,并添加映射路径和具体的CORS配置信息。
1package edu.xpu.cors.config;
2
3@Configuration
4public class GlobalCorsConfig {
5 @Bean
6 public CorsFilter corsFilter() {
7 //1.添加CORS配置信息
8 CorsConfiguration config = new CorsConfiguration();
9 //放行哪些原始域
10 config.addAllowedOrigin("*");
11 //是否发送Cookie信息
12 config.setAllowCredentials(true);
13 //放行哪些原始域(请求方式)
14 config.addAllowedMethod("*");
15 //放行哪些原始域(头部信息)
16 config.addAllowedHeader("*");
17 //暴露哪些头部信息(因为跨域访问默认不能获取全部头部信息)
18 config.addExposedHeader("*");
19
20 //2.添加映射路径
21 UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource();
22 configSource.registerCorsConfiguration("/**", config);
23
24 //3.返回新的CorsFilter.
25 return new CorsFilter(configSource);
26 }
27}
2、重写WebMvcConfigurer
在任意配置类,返回一个新的WebMvcConfigurer Bean,并重写其提供的跨域请求处理的接口,目的是添加映射路径和具体的CORS配置信息。
1package edu.xpu.cors.config;
2
3@Configuration
4public class GlobalCorsConfig {
5 @Bean
6 public WebMvcConfigurer corsConfigurer() {
7 return new WebMvcConfigurer() {
8 @Override
9 //重写父类提供的跨域请求处理的接口
10 public void addCorsMappings(CorsRegistry registry) {
11 //添加映射路径
12 registry.addMapping("/**")
13 //放行哪些原始域
14 .allowedOrigins("*")
15 //是否发送Cookie信息
16 .allowCredentials(true)
17 //放行哪些原始域(请求方式)
18 .allowedMethods("GET","POST", "PUT", "DELETE")
19 //放行哪些原始域(头部信息)
20 .allowedHeaders("*")
21 //暴露哪些头部信息(因为跨域访问默认不能获取全部头部信息)
22 .exposedHeaders("Header1", "Header2");
23 }
24 };
25 }
26}