springboot前后端分离跨域同源问题

笔者最近做springboot前后端分离遇到一些问题,在这里分享下。主要是跨域问题,导致后端无法获取自定义请求头,

前端后台分开部署在不同域名,自然而然就会存在跨域问题,前端ajax的处理方式通常就是jsonp。

springboot 后端配置有如下两种方式,二选一就好

1、

@Configuration
public class WebConfig extends WebMvcConfigurerAdapter {

    /**
     * 增加对跨域对支持
     * @param registry
     */
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")// 这是请求映射路径
                .allowedHeaders("*")// 这里是所有请求头的意思
                .allowedOrigins("*")// 允许任何源反问(不安全),这里一般填前端域名
                .allowedMethods("POST", "GET", "PUT", "OPTIONS", "DELETE")
                .maxAge(3600)
                .allowCredentials(true);
    }
}

2、

@Component
public class CustomCorsFilter extends CorsFilter {

    public CustomCorsFilter() {
        super(configurationSource());
    }

    private static UrlBasedCorsConfigurationSource configurationSource() {
        CorsConfiguration config = new CorsConfiguration();
        config.setAllowCredentials(true);
        config.addAllowedOrigin("*");
        config.addAllowedHeader("*");
        config.setMaxAge(36000L);
        config.setAllowedMethods(Arrays.asList("GET", "HEAD", "POST", "PUT", "DELETE", "OPTIONS"));
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**", config);
        return source;
    }
}

 

配置完以上信息之后跟前端调试,登录请求就无法进入到指定方法。已经在拦截器被拦截。一直很郁闷。前端debbug模式返回如下:

一直以为是前端的问题。后面才知道是浏览器跨域同源问题,浏览器会先发送一个options的预请求,当后端返回拦截返回true,浏览器才回发起真正的请求,后端拦截器配置如下:

public class RestApiInteceptor extends HandlerInterceptorAdapter {

    @Override
    public boolean preHandle(HttpServletRequest request, HttpServletResponse              response, Object handler) throws Exception {
        if (handler instanceof org.springframework.web.servlet.resource.ResourceHttpRequestHandler) {
            return true;
        }
//        HandlerMethod handlerMethod = (HandlerMethod) handler;
        return check(request, response, null);
    }

    private boolean check(HttpServletRequest request, HttpServletResponse response, HandlerMethod handlerMethod) {
        if (request.getServletPath().equals(JwtConstants.AUTH_PATH)) {
            return true;
        }
        if("OPTIONS".equals(request.getMethod())){
            try{
                //预请求需要往回写 让ajax预请求知道预请求是成功的
                response.setStatus(200);
                response.getWriter().write(1);
                return true;
            }catch (Exception e){
                return false;
            }
        }

        return true;
    }

至此,前后端分离跨域问题才算解决 

 

 

你可能感兴趣的:(挖坑填坑记)