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 配置信息。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26 27
| package edu.xpu.cors.config;
@Configuration public class GlobalCorsConfig { @Bean public CorsFilter corsFilter() { CorsConfiguration config = new CorsConfiguration(); config.addAllowedOrigin ("*"); config.setAllowCredentials (true); config.addAllowedMethod ("*"); config.addAllowedHeader ("*"); config.addExposedHeader ("*");
UrlBasedCorsConfigurationSource configSource = new UrlBasedCorsConfigurationSource(); configSource.registerCorsConfiguration ("/**", config);
return new CorsFilter(configSource); } }
|
在任意配置类,返回一个新的 WebMvcConfigurer Bean,并重写其提供的跨域请求处理的接口,目的是添加映射路径和具体的 CORS 配置信息。
1 2 3 4 5 6 7 8 9 10 11 12 13 14 15 16 17 18 19 20 21 22 23 24 25 26
| package edu.xpu.cors.config;
@Configuration public class GlobalCorsConfig { @Bean public WebMvcConfigurer corsConfigurer() { return new WebMvcConfigurer() { @Override public void addCorsMappings(CorsRegistry registry) { registry.addMapping ("/**") .allowedOrigins ("*") .allowCredentials (true) .allowedMethods ("GET","POST", "PUT", "DELETE") .allowedHeaders ("*") .exposedHeaders ("Header1", "Header2"); } }; } }
|