Spring后端Comment/edit接口CORS跨域请求失败求助

1. 检查CORS配置是否覆盖OPTIONS请求 #

多数情况下问题出在CORS配置未明确允许OPTIONS方法，或路径匹配未覆盖/edit接口：

• 若用@CrossOrigin注解，需确保加到CommentController或/edit方法上，并指定允许OPTIONS：

@RestController
@RequestMapping("/comments")
@CrossOrigin(origins = "你的前端域名", allowedMethods = {"GET", "POST", "OPTIONS"}, allowedHeaders = "*")
public class CommentController {
    @PostMapping("/edit")
    public ResponseEntity<?> editComment(...) {
        // 业务逻辑
    }
}

• 若用全局CORS配置，需确保路径匹配覆盖目标接口，且显式包含OPTIONS方法：

@Configuration
public class CorsConfig implements WebMvcConfigurer {
    @Override
    public void addCorsMappings(CorsRegistry registry) {
        registry.addMapping("/**")
                .allowedOrigins("你的前端域名")
                .allowedMethods("GET", "POST", "PUT", "DELETE", "OPTIONS")
                .allowedHeaders("*")
                .allowCredentials(true);
    }
}

2. 排查前端请求是否携带特殊头 #

如果前端请求包含默认外的自定义头（如Authorization、X-Requested-With），会触发预检。此时需确保后端CORS配置允许这些头，同时前端避免添加不必要的自定义头：

fetch('/api/comments/edit', {
  method: 'POST',
  credentials: 'include',
  headers: {
    'Content-Type': 'application/json'
    // 移除非必要自定义头，减少预检触发概率
  },
  body: JSON.stringify(commentData)
})

3. 检查自定义过滤器是否拦截OPTIONS请求 #

即便未用Spring Security，自定义过滤器（如日志、参数校验过滤器）可能误拦截OPTIONS请求并返回401。需在过滤器中直接放行OPTIONS请求：

public class CustomFilter extends OncePerRequestFilter {
    @Override
    protected void doFilterInternal(HttpServletRequest request, HttpServletResponse response, FilterChain filterChain) throws ServletException, IOException {
        if ("OPTIONS".equalsIgnoreCase(request.getMethod())) {
            response.setStatus(HttpServletResponse.SC_OK);
            return;
        }
        filterChain.doFilter(request, response);
    }
}

4. 确认请求路径完全匹配 #

用浏览器开发者工具查看前端请求的完整URL，和Postman中的请求路径对比，确保没有路径拼写错误（比如Controller有@RequestMapping("/comments")时，实际接口路径应为/comments/edit，而非/edit）。

5. 排查反向代理（如Nginx）的CORS冲突 #

若后端部署在Nginx后，Nginx的CORS配置可能和Spring配置冲突，导致OPTIONS请求被拦截。需在Nginx配置中单独处理OPTIONS请求：

location /api {
    if ($request_method = OPTIONS) {
        add_header Access-Control-Allow-Origin "你的前端域名";
        add_header Access-Control-Allow-Methods "GET, POST, OPTIONS";
        add_header Access-Control-Allow-Headers "*";
        add_header Access-Control-Allow-Credentials "true";
        return 204;
    }
    proxy_pass http://backend;
}

内容的提问来源于stack exchange，提问作者ramil