springboot+vue后端解决跨域问题

最新推荐文章于 2024-05-17 00:36:13 发布

原创最新推荐文章于 2024-05-17 00:36:13 发布 · 150 阅读

0 ·

CC 4.0 BY-SA版权

文章标签：

#vue.js #java #spring boot

本文介绍了一个使用Spring Boot和Vue实现跨域请求的解决方案。通过自定义过滤器设置HTTP响应头来允许指定的请求方法和头部信息，确保前后端分离项目的顺利运行。

摘要生成于 C知道，由 DeepSeek-R1 满血版支持，前往体验 >

springboot+vue后端解决跨域问题

vue配置

自定义过滤器配置

@Component
@Order(Integer.MIN_VALUE)
@Slf4j
public class Filter implements javax.servlet.Filter {

    @Override
    public void doFilter(ServletRequest request, ServletResponse response, FilterChain chain) throws IOException, ServletException {

        ((HttpServletResponse)response).setHeader("Access-Control-Allow-Origin", ((HttpServletRequest) request).getHeader("Origin"));
        ((HttpServletResponse)response).setHeader("Access-Control-Allow-Methods", "POST, GET, OPTIONS, DELETE");
        ((HttpServletResponse)response).setHeader("Access-Control-Max-Age", "3600");
        ((HttpServletResponse)response).setHeader("Access-Control-Allow-Headers", "x-requested-with,Authorization,content-type,x-token");
        ((HttpServletResponse)response).setHeader("Access-Control-Allow-Credentials", "true");
        if (((HttpServletRequest) request).getMethod().equals("OPTIONS")) {
            ((HttpServletResponse) response).setStatus(204);
            response.getWriter().println("ok");
            return;
        }
        chain.doFilter(request, response);
    }
}