后端cors跨域出错 前后端分离

2023.1.12

和朋友一起开发小型后台管理系统的时候,他的前端cors跨域报错,于是我就用springmvc提供的方法进行跨域处理。但是问题并未解决。后面查了很多资料想了很久。

一个http请求,先走filter,到达servlet后才进行拦截器的处理,而我的项目使用过滤器filter进行登录验证,也就是说,在springmvc加的配置不会赶在登录验证代码执行之前生效,等同于没有配置。我们可以把cors放在filter里,先执行处理cors的过滤器,再执行其他filter和controller的代码。

/**
 * 过滤器,用于cors跨域处理
 */
@Slf4j
@WebFilter(filterName = "corsFilter", urlPatterns = "/*")
public class CorsFilter implements Filter {

    /**
     * 跨域处理
     * @param servletRequest
     * @param servletResponse
     * @param filterChain
     * @throws IOException
     * @throws ServletException
     */
    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
        HttpServletRequest request = (HttpServletRequest) servletRequest;
        HttpServletResponse response = (HttpServletResponse) servletResponse;
        String origin = request.getHeader("origin");// 获取源站
        response.setHeader("Access-Control-Allow-Origin", origin);
        response.setHeader("Access-Control-Allow-Methods", "POST, GET");
        response.setHeader("Access-Control-Max-Age", "3600");
        response.setHeader("Access-Control-Allow-Credentials", "true");
        response.setHeader("Access-Control-Allow-Headers", "Content-Type, Access-Control-Allow-Headers, Authorization, X-Requested-With");
        filterChain.doFilter(request , response);
    }

    @Override
    public void destroy() {

    }

    @Override
    public void init(FilterConfig filterConfig) throws ServletException {

    }
}

这里注意,尽量提高改过滤器的优先级,filterame根据字符串大小比较,越大的优先级越高。 


2023.1.16

在学习微服务项目的时候,又出现了cors报错,前端报错

Request header field token is not allowed by Access-Control-Allow-Headers in preflight response.

//请求头字段token在预检请求的响应里不允许

 所以我们在后端对cors的处理需要允许前端带到后端的token字段


2023.1.29 

发现一种更好的方式,我写在了网关的配置文件里

/**
 * 网关配置
 */
@Configuration
public class CorsConfig {

    /**
     * Cors 跨域
     * @return
     */
    @Bean
    public CorsWebFilter corsFilter() {
        CorsConfiguration corsConfiguration = new CorsConfiguration();
        // 允许的请求源 (如:http://localhost:8080)
        corsConfiguration.addAllowedOrigin("*");
        // 允许的请求方法 ==> GET, HEAD, POST, PUT, PATCH, DELETE, OPTIONS, TRACE
        corsConfiguration.addAllowedMethod("*");
        // 允许的请求头
        corsConfiguration.addAllowedHeader("*");
        // 是否允许携带cookie跨域
        corsConfiguration.setAllowCredentials(true);
        // URL 映射 (如: /admin/**)
        // 任意url都要进行跨域配置
        UrlBasedCorsConfigurationSource source = new UrlBasedCorsConfigurationSource();
        source.registerCorsConfiguration("/**",corsConfiguration);

        return new CorsWebFilter(source);

    }
}

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

玛卡左家陇分卡

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值