Springboot整合Shiro前后端分离跨域问题

前言：SpringBoot整合shiro进行前后端分离开发时（前端是Vue），项目做了跨域配置，但还是前端请求会出现cros err–显示的跨域问题（Access-Control-Allow-Origin ）。后端没有任何报错显示，逐步分析才慢慢理解。

解决：如下是我的跨域配置：

package com.carshow.data.config;import org.springframework.boot.web.servlet.FilterRegistrationBean;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import org.springframework.http.HttpStatus;
import org.springframework.web.cors.CorsConfiguration;
import org.springframework.web.cors.UrlBasedCorsConfigurationSource;
import org.springframework.web.filter.CorsFilter;
import javax.servlet.*;
import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;
import java.io.IOException;/*** @Author xw* @Description  跨域访问控制, 做前后分离的话，这个也是必配的* @Date 2021/4/12  13:07*/
@Configuration
public class CorsConfig implements Filter {private CorsConfiguration buildConfig() {CorsConfiguration corsConfiguration = new CorsConfiguration();// 允许任何域名使用corsConfiguration.addAllowedOriginPattern("*");// 允许任何头corsConfiguration.addAllowedHeader("*");// 允许任何方法（post、get等）corsConfiguration.addAllowedMethod("*");//允许cookiecorsConfiguration.setAllowCredentials(true);// 是否支持安全证书(必需参数)corsConfiguration.setMaxAge(3600L);// 预检请求的有效期，单位为秒。corsConfiguration.addExposedHeader("set-cookie");corsConfiguration.addExposedHeader("access-control-allow-headers");corsConfiguration.addExposedHeader("access-control-allow-methods");corsConfiguration.addExposedHeader("access-control-allow-origin");corsConfiguration.addExposedHeader("access-control-max-age");corsConfiguration.addExposedHeader("X-Frame-Options");return corsConfiguration;}@Beanpublic CorsFilter corsFilter() {UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();// 对接口配置跨域设置source.registerCorsConfiguration("/**", buildConfig());return new CorsFilter(source);}@Overridepublic void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {HttpServletRequest request = (HttpServletRequest) servletRequest;HttpServletResponse response = (HttpServletResponse) servletResponse;response.setHeader("Access-control-Allow-Origin", request.getHeader("Origin"));response.setHeader("Access-Control-Allow-Credentials", "true");response.setHeader("Access-Control-Allow-Headers", request.getHeader("Access-Control-Request-Headers"));response.addHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, PUT");if ("OPTIONS".equals(request.getMethod())) {response.setStatus(HttpStatus.NO_CONTENT.value());return;} else {filterChain.doFilter(request, response);}}@Beanpublic FilterRegistrationBean replaceTokenFilter(){FilterRegistrationBean registration = new FilterRegistrationBean();registration.setDispatcherTypes(DispatcherType.REQUEST);registration.setFilter( new CorsConfig ());registration.addUrlPatterns("/*");registration.setName("crosFilter ");registration.setOrder(1);return registration;}
}

原因：浏览器会在发送真正请求之前，先发送一个方法为OPTIONS的预检请求 Preflighted requests 这个请求是用来验证本次请求是否安全的，而且并不是所有请求都会发送，需要符合以下条件：

请求方法不是GET/HEAD/POST
POST请求的Content-Type并非application/x-www-form-urlencoded, multipart/form-data, 或text/plain
请求设置了自定义的header字段

后端使用了shiro安全框架，每次请求需要在header中携带自定义的字段（Authorization），所以浏览器会多发送一个OPTIONS请求，但是OPTIONS请求不会携带Authorization，后端验证不通，所以会产生跨域问题。

解决问题关键点：使用拦截器解决跨域问题，并且针对OPTIONS请求做放行处理

 @Overridepublic void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {HttpServletRequest request = (HttpServletRequest) servletRequest;HttpServletResponse response = (HttpServletResponse) servletResponse;response.setHeader("Access-control-Allow-Origin", request.getHeader("Origin"));response.setHeader("Access-Control-Allow-Credentials", "true");response.setHeader("Access-Control-Allow-Headers", request.getHeader("Access-Control-Request-Headers"));response.addHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE, PUT");if ("OPTIONS".equals(request.getMethod())) {response.setStatus(HttpStatus.NO_CONTENT.value());return;} else {filterChain.doFilter(request, response);}}@Beanpublic FilterRegistrationBean replaceTokenFilter(){FilterRegistrationBean registration = new FilterRegistrationBean();registration.setDispatcherTypes(DispatcherType.REQUEST);registration.setFilter( new CorsConfig ());registration.addUrlPatterns("/*");registration.setName("crosFilter ");registration.setOrder(1);return registration;}

OK！

Springboot整合Shiro前后端分离跨域问题相关推荐

前后端分离跨域问题解决方案
问题因为最近在学习vue和springboot.用到了前后端分离.前端webpack打包运行的时候会启动nodejs的服务器占用8080端口,后端springboot自带tomcat启动占用1111 ...
pc网站调用微服务器,【微服务】前后端分离-跨域问题和解决方案
跨域问题存在的原因跨域问题的根本原因:因为浏览器收到同源策略的限制,当前域名的js只能读取同域下的窗口属性.什么叫做同源策略?就是不同的域名, 不同端口, 不同的协议不允许共享资源的,保障浏览器安全 ...
springboot集成shiro 前后端分离统一处理shiro异常
springboot集成shiro 前后端分离统一处理shiro异常参考文章: (1)springboot集成shiro 前后端分离统一处理shiro异常 (2)https://www.cnbl ...
【python学习笔记】关于python Flask前后端分离跨域问题
关于python Flask前后端分离跨域问题前后端分离过程中,前后端对接测试难免遇到跨域问题.因为是个新司机,所以在我经过一天的测试,才找到解决办法=-= 第一种方法 from functools ...
shiro+php,一套基于SpringBoot+Vue+Shiro 前后端分离开发的代码生成器
一.前言最近花了一个月时间完成了一套基于Spring Boot+Vue+Shiro前后端分离的代码生成器,目前项目代码已基本完成止步传统CRUD,进阶代码优化: 该项目可根据数据库字段动态生成 c ...
nginx处理前后端分离跨域问题
在微服务中,通常会使用前后端分离的方式进行开发和部署.由于前后端分开部署,属于不同的"资源",因此前端调用后端API时可能会出现跨域问题,Cross-Origin Resource ...
cors 前后端分离跨域问题_前后端分离之CORS跨域访问踩坑总结
前言前后端分离的开发模式越来越流行,目前绝大多数的公司与项目都采取这种方式来开发,它的好处是前端可以只专注于页面实现,而后端则主要负责接口开发,前后端分工明确,彼此职责分离,不再高度耦合,但是由于这 ...
SpringBoot集成Shiro前后端分离使用redis做缓存
文章目录一 .shiro介绍 1.基础介绍 2.基本功能点 3.基本流程图二. 常用的权限管理表关系 2.1. 表组成 2.2. 表结构三.实战案例 3.1. 案例介绍 3.2. 依赖 3.3. ...
前后端分离跨域问题Access to XMLHttpRequest at ‘http://localhos...has been blocked by CORS policy: No ‘Access-
完整报错如下: Access to XMLHttpRequest at 'http://localhost:8081/login' from origin 'http://localhost:8084 ...

Springboot整合Shiro前后端分离跨域问题

Springboot整合Shiro前后端分离跨域问题

前言：SpringBoot整合shiro进行前后端分离开发时（前端是Vue），项目做了跨域配置，但还是前端请求会出现cros err–显示的跨域问题（Access-Control-Allow-Origin ）。后端没有任何报错显示，逐步分析才慢慢理解。

解决：如下是我的跨域配置：

原因：浏览器会在发送真正请求之前，先发送一个方法为OPTIONS的预检请求 Preflighted requests 这个请求是用来验证本次请求是否安全的，而且并不是所有请求都会发送，需要符合以下条件：

后端使用了shiro安全框架，每次请求需要在header中携带自定义的字段（Authorization），所以浏览器会多发送一个OPTIONS请求，但是OPTIONS请求不会携带Authorization，后端验证不通，所以会产生跨域问题。

解决问题关键点：使用拦截器解决跨域问题，并且针对OPTIONS请求做放行处理

Springboot整合Shiro前后端分离跨域问题相关推荐

最新文章

热门文章