Spring 和 React 中有关 JWT 令牌和 CORS 的问题

Question

我正在尝试创建一个使用令牌身份验证方法的 Spring Boot 应用程序。我想轻松一点，所以我使用这个 repo https://www.bezkoder.com/spring-boot-login-example-mysql/ 作为灵感。没有 SQL 问题。我的代码与那里的代码完全相同。

当我在 POSTMAN 中执行请求时，一切正常，没有任何问题。 当我在前端执行请求时，我收到 CORS 错误，指出我错过了标头或某种类型。我通过在项目中添加以下类来解决这个问题

@Configuration
@EnableWebMvc
public class WebConfig implements WebMvcConfigurer {

    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry
                .addMapping("/**")
                .allowCredentials(true)
                .allowedHeaders("*")
                .allowedOrigins("http://localhost:3000");
    }
}

此时，我得到了具有正确值的

set-cookie

标头，但 cookie 尚未设置。我还在 AXIOS 的标头请求中添加了

withCredentials: true

。有人可以向我解释一下发生了什么，并使用 React 作为前端来展示这个问题的解决方案吗？

非常感谢！

Answer 1

使用它并查看它是否有效，确保创建一个不同的java类并在你的application.properties中写入app.client.url =“localhost your url”

@Component

@Order(有序.HIGHEST_PRECEDENCE) 公共类 SimpleCorsFilter 实现 Filter {

@Value("${app.client.url}")
private String clientAppUrl = "";

public SimpleCorsFilter() {
}

@Override
public void doFilter(ServletRequest req, ServletResponse res, FilterChain chain) throws IOException, ServletException {
    HttpServletResponse response = (HttpServletResponse) res;
    HttpServletRequest request = (HttpServletRequest) req;
    Map<String, String> map = new HashMap<>();
    String originHeader = request.getHeader("origin");
    response.setHeader("Access-Control-Allow-Origin", originHeader);
    response.setHeader("Access-Control-Allow-Methods", "POST, GET, PUT, OPTIONS, DELETE");
    response.setHeader("Access-Control-Max-Age", "3600");
    response.setHeader("Access-Control-Allow-Headers", "*");

    if ("OPTIONS".equalsIgnoreCase(request.getMethod())) {
        response.setStatus(HttpServletResponse.SC_OK);
    } else {
        chain.doFilter(req, res);
    }
}

@Override
public void init(FilterConfig filterConfig) {
}

@Override
public void destroy() {
}

}