React向Spring Boot POST对象时出现反序列化错误，求解决方案

核心原因 #

错误提示Cannot deserialize value of type java.lang.String from Object value说明Spring Boot在反序列化请求体时，试图将JSON对象解析为String类型，但后端接口声明接收的是RegistrationDTO对象，本质是请求体格式与后端期望的类型不匹配，或DTO的序列化配置存在问题。

排查步骤与解决方案 #

1. 检查RegistrationDTO的序列化配置 #

Spring Boot默认用Jackson处理JSON序列化/反序列化，必须满足以下要求：

• 必须有无参构造函数：Jackson需要通过无参构造创建DTO实例，仅提供带参构造会导致无法实例化对象。

  public class RegistrationDTO {
      private String name;
      private String phone;
      private String username;
      private String password;
  
      // 必须添加无参构造
      public RegistrationDTO() {}
  
      // 带参构造、getter、setter...
  }
  

• getter/setter必须符合规范：每个字段要有对应的getter和setter方法，方法名需遵循JavaBean规则（如getName()对应name字段）。可以用Lombok的@Data注解自动生成，避免手动写错：

  import lombok.Data;
  
  @Data // 自动生成无参构造、getter、setter等方法
  public class RegistrationDTO {
      private String name;
      private String phone;
      private String username;
      private String password;
  }
  

2. 验证前端请求的实际Payload #

打开浏览器开发者工具的Network面板，找到/auth/register的POST请求，查看Request Payload是否为正确的JSON对象，示例：

{
  "name": "张三",
  "phone": "13800138000",
  "username": "zhangsan@example.com",
  "password": "123456"
}

• 若Payload不是JSON格式（比如是FormData），说明前端请求被篡改，检查是否有axios全局拦截器修改了请求体或Content-Type。
• 若某个字段是数字类型（比如phone为13800138000而非字符串），建议前端统一将所有字段转为字符串，避免类型不匹配。

3. 检查后端接口配置 #

• 确保@PostMapping没有设置错误的consumes属性，若指定consumes = MediaType.TEXT_PLAIN_VALUE，会强制将请求体解析为String，导致错误。保持默认配置即可：

  @PostMapping("/register") // 默认支持application/json，无需额外设置consumes
  public String registerUser(@RequestBody RegistrationDTO body){
      // ...业务逻辑
  }
  

• 确认项目已引入Jackson依赖，Spring Boot Starter Web默认包含该依赖，若为自定义依赖需添加：

  <dependency>
      <groupId>com.fasterxml.jackson.core</groupId>
      <artifactId>jackson-databind</artifactId>
  </dependency>
  

4. 排查前端请求的潜在问题 #

• 避免axios全局拦截器篡改请求体，比如不要将JSON对象转为FormData：

  // 错误示例：请勿将请求体转为FormData
  const formData = new FormData();
  formData.append('name', name);
  // ...
  

• 可以简化前端请求代码，axios会自动设置Content-Type: application/json，无需手动配置：

  const registerUser = async (name, phone, email, password) => {
      const apiEndpoint = 'http://localhost:8000/auth/register';
      const req = {        
          name: name,
          phone: phone,
          username: email,
          password: password
      };
      try {
          const resp = await axios.post(apiEndpoint, req);
          return resp.data;
      } catch (error) {
          console.error(error.response?.data || error.message);
          return null;
      }
  };
  

总结 #

最常见的问题是RegistrationDTO缺少无参构造函数或getter/setter错误，优先检查DTO配置，再验证请求Payload格式，基本可以解决该问题。

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