当前位置:   article > 正文

SpringBoot解决跨域的五种方案_springboot跨域问题解决方案

springboot跨域问题解决方案

一、同源策略

同源,就是咱们域名、端口号、ip、采用的协议都相同,那么我们就是同源的
反之就是不同源的!!!
出于浏览器的同源策略限制。同源策略(Sameoriginpolicy)是一种约定,它是浏览器最核心也最基本的安全功能,如果缺少了同源策略,则浏览器的正常功能可能都会受到影响。可以说Web是构建在同源策略基础之上的,浏览器只是针对同源策略的一种实现。
所以,用最简单的话来说,就是前端可以发请求给服务器,服务器也可以进行响应,只是因为浏览器会对请求头进行判断,所以要么前端设置请求头,要么后端设置请求头

 

二、跨域问题

跨域报错如下:

Access to XMLHttpRequest at 'http://localhost:8080/t1' from origin 'http://localhost:63342' has been blocked by CORS policy: No 'Access-Control-Allow-Origin' header is present on the requested resource.
test1.html?_ijt=aekdfma33ut4n31cgsohdrjt89:17 {readyState: 0, getResponseHeader: ƒ, getAllResponseHeaders: ƒ, setRequestHeader: ƒ, overrideMimeType: ƒ, …}
jquery-1.9.1.min.js:5 GET http://localhost:8080/t1 net::ERR_FAILED 200

三、spring boot解决跨域问题

对于 CORS的跨域请求,主要有以下几种方式可供选择:

  • 返回新的CorsFilter
  • 重写 WebMvcConfigurer
  • 使用注解 @CrossOrigin
  • 手动设置响应头 (HttpServletResponse)
  • 自定web filter 实现跨域

注意:

CorFilter / WebMvConfigurer / @CrossOrigin 需要 SpringMVC 4.2以上版本才支持,对应springBoot 1.3版本以上
上面前两种方式属于全局 CORS 配置,后两种属于局部 CORS配置。如果使用了局部跨域是会覆盖全局跨域的规则,所以可以通过 @CrossOrigin 注解来进行细粒度更高的跨域资源控制。
其实无论哪种方案,最终目的都是修改响应头,向响应头中添加浏览器所要求的数据,进而实现跨域

 1、使用CorsFilter

  1. @Configuration
  2. public class corsFilter {
  3. @Bean
  4. public CorsFilter CorsFilter() {
  5. CorsConfiguration corsConfiguration = new CorsConfiguration();
  6. corsConfiguration.addAllowedOriginPattern("*");
  7. corsConfiguration.addAllowedHeader("*");
  8. corsConfiguration.addAllowedMethod("*");
  9. corsConfiguration.setAllowCredentials(true);
  10. UrlBasedCorsConfigurationSource urlBasedCorsConfigurationSource = new UrlBasedCorsConfigurationSource();
  11. urlBasedCorsConfigurationSource.registerCorsConfiguration("/**",corsConfiguration);
  12. return new CorsFilter(urlBasedCorsConfigurationSource);
  13. }
  14. }

2、实现WebMvcConfigurer里面的addCorsMappings方法

  1. @Configuration
  2. public class corsFilter1 implements WebMvcConfigurer {
  3. @Override
  4. public void addCorsMappings(CorsRegistry registry) {
  5. registry.addMapping("/**") // 匹配所有的路径
  6. .allowCredentials(true) // 设置允许凭证
  7. .allowedHeaders("*") // 设置请求头
  8. .allowedMethods("GET","POST","PUT","DELETE") // 设置允许的方式
  9. .allowedOriginPatterns("*");
  10. }
  11. }

3、@CrossOrigin局部跨域通过

  1. @GetMapping("/t2")
  2. @CrossOrigin
  3. public Map t2() {
  4. HashMap<String, Object> map = new HashMap<>();
  5. User user = new User();
  6. user.setUsername("123456");
  7. user.setPassword("程世玉");
  8. map.put("user",user);
  9. return map;
  10. }

4、添加响应头解决跨域

  1. @RequestMapping(value = "/user-1")
  2. public User getUser_1(HttpServletResponse response ) {
  3. // 允许所有,不安全
  4. response.addHeader("Access-Control-Allow-Origin", "*");
  5. response.addHeader("Access-Control-Max-Age", "10");
  6. response.setHeader("Access-Control-Allow-Headers", "Origin, X-Requested-With, Content-Type, Accept");
  7. response.setHeader("Access-Control-Allow-Methods", "GET, POST, PUT");
  8. response.setHeader("Access-Control-Allow-Credentials", "true");
  9. return new User(1L, "Booker", "admin", "sdfsdkjf93hu8dvn");
  10. }

5、使用自定义filter实现跨域

  1. public class MyCorsFilter implements Filter {
  2. public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
  3. HttpServletResponse response = (HttpServletResponse) res;
  4. response.setHeader("Access-Control-Allow-Origin", "*");
  5. response.setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
  6. response.setHeader("Access-Control-Max-Age", "3600");
  7. response.setHeader("Access-Control-Allow-Headers", "x-requested-with,content-type");
  8. chain.doFilter(req, res);
  9. }
  10. public void init(FilterConfig filterConfig) {}
  11. public void destroy() {}
  12. }
  13. @Configuration
  14. public class FilterConfig {
  15. @Bean
  16. public FilterRegistrationBean filterRegistrationBean(){
  17. FilterRegistrationBean bean = new FilterRegistrationBean();
  18. bean.setFilter(new MyCorsFilter());
  19. bean.addUrlPatterns("/*");
  20. return bean;
  21. }
  22. }

声明:本文内容由网友自发贡献,不代表【wpsshop博客】立场,版权归原作者所有,本站不承担相应法律责任。如您发现有侵权的内容,请联系我们。转载请注明出处:https://www.wpsshop.cn/w/花生_TL007/article/detail/629114
推荐阅读
相关标签
  

闽ICP备14008679号