如何解决Spring Boot中Ajax调用API时出现的POST方法不支持问题？

这种情况我开发时也踩过坑，Postman能正常POST但Ajax不行，大概率是这几个常见问题导致的，咱们一步步排查解决：

1. CSRF防护拦截了请求 #

Spring Boot默认开启了CSRF（跨站请求伪造）防护，Postman测试时通常不会带CSRF Token所以能正常通过，但浏览器端的Ajax请求会被拦截。

解决办法： #

• 方案一：在Ajax请求中携带CSRF Token
  先在HTML页面里通过JSTL获取并渲染Token：

  <meta name="_csrf" content="${_csrf.token}"/>
  <meta name="_csrf_header" content="${_csrf.headerName}"/>
  

  然后在Ajax请求里添加请求头：

  $(document).ready(function() {
    $("#your-form").submit(function(event) {
      event.preventDefault(); // 阻止表单默认提交行为
      var csrfToken = $('meta[name="_csrf"]').attr('content');
      var csrfHeader = $('meta[name="_csrf_header"]').attr('content');
      
      $.ajax({
        url: "/your-api-endpoint",
        type: "POST",
        headers: {
          [csrfHeader]: csrfToken
        },
        data: $("#your-form").serialize(), // 或者转成JSON格式
        success: function(response) {
          console.log("请求成功:", response);
        },
        error: function(xhr) {
          console.log("请求失败:", xhr.responseText);
        }
      });
    });
  });
  

• 方案二：开发环境临时关闭CSRF（不推荐生产环境）
  如果是开发测试阶段，可以在Spring Security配置类里关闭CSRF：

  @Configuration
  @EnableWebSecurity
  public class SecurityConfig extends WebSecurityConfigurerAdapter {
    @Override
    protected void configure(HttpSecurity http) throws Exception {
      http.csrf().disable() // 关闭CSRF防护
          .authorizeRequests()
          .anyRequest().permitAll();
    }
  }
  

2. 请求Content-Type不匹配 #

Postman测试时你可能设置了Content-Type: application/json，但HTML表单默认的Ajax请求是application/x-www-form-urlencoded，而你的Controller接口可能只接受JSON格式的请求。

解决办法： #

• 修改Controller支持多种Content-Type
  在@PostMapping里指定consumes属性，同时支持两种格式：

  @RestController
  @RequestMapping("/api")
  public class YourController {
    @PostMapping(value = "/save", consumes = {"application/json", "application/x-www-form-urlencoded"})
    public ResponseEntity<?> saveData(@RequestBody(required = false) YourModel model, 
                                      @RequestParam Map<String, String> params) {
      // 处理逻辑：如果是JSON用model，表单格式用params转成model
      return ResponseEntity.ok("保存成功");
    }
  }
  

• 让Ajax发送JSON格式请求
  把表单数据转成JSON字符串，并设置contentType为application/json：

  $("#your-form").submit(function(event) {
    event.preventDefault();
    var formData = {
      field1: $("#field1").val(),
      field2: $("#field2").val()
      // 对应你的Model字段
    };
    
    $.ajax({
      url: "/api/save",
      type: "POST",
      contentType: "application/json",
      data: JSON.stringify(formData),
      headers: {
        'X-CSRF-TOKEN': $('meta[name="_csrf"]').attr('content')
      },
      success: function(response) {
        console.log(response);
      }
    });
  });
  

3. 请求路径不一致 #

仔细检查Ajax里的请求URL和Postman里的是否完全一致：

• 比如Spring Boot配置了server.servlet.context-path=/app，那Ajax的URL应该是/app/api/save，而Postman里如果已经加了这个前缀，Ajax没加就会报错。
• 注意URL末尾的斜杠，比如Postman用的是/api/save/，Ajax用的是/api/save，虽然大部分时候Spring会处理，但偶尔也会导致匹配失败。

4. 表单默认提交行为未阻止 #

如果HTML表单本身设置了action和method，同时又用Ajax提交，可能会触发两次请求，或者浏览器默认的表单提交会覆盖Ajax请求，导致路径错误。

确保在Ajax的提交事件里阻止默认行为：

$("#your-form").submit(function(event) {
  event.preventDefault(); // 关键：阻止表单默认提交
  // 后续Ajax逻辑
});

先从这几个点排查，应该能解决问题。

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