React中axios.post携带FormData请求Nest.js后端返回空对象问题

axios.post 提交 FormData 时始终返回空对象 {}

问题代码 #

const UserSignup = () => {
  
  const signupUser = async (event) => {
    try {
      event.preventDefault();
      const formData = new FormData(document.getElementById('signupForm'));
      const res = await axios.post(
        `${process.env.REACT_APP_BACKEND}/users/signup`,
        formData
      );

      console.log(res.data);
    } catch (error) {
      console.log(error);
    }
  };

  return (
    <Container>
      <h1>signup form</h1>
      <form onSubmit={signupUser} id="signupForm">
        email : <HTextInput name="email" />
        password :
        <HTextInput name="password" type="password" />
        passwordCheck :
        <HTextInput name="passwordCheck" type="password" />
        <Button type="submit">signup</Button>
      </form>
    </Container>
  );
};

已排查项 #

• FormData 键值对是否正常存储？
  是，已通过如下代码打印验证键值对正常：

...
const formData = new FormData(document.getElementById('signupForm'));

      // FormData key
      for (let key of formData.keys()) {
        console.log(key);
      }

      // FormData value
      for (let value of formData.values()) {
        console.log(value);
      }

      const res = await axios.post(
        `${process.env.REACT_APP_BACKEND}/users/signup`,
        formData
      );
...

• 后端（Nest.js）服务是否正常运行？
  是，使用 Postman 测试接口完全正常，后端日志可确认请求处理逻辑无问题。

解决方案 #

• 检查axios全局/局部请求配置是否存在transformRequest配置，若存在请对FormData类型的请求体跳过序列化处理：

// 全局配置修改示例
axios.defaults.transformRequest = [
  (data, headers) => {
    // FormData类型直接返回，不做JSON序列化
    if (data instanceof FormData) {
      return data
    }
    // 普通JSON请求保留原有序列化逻辑
    return JSON.stringify(data)
  }
]

// 单请求临时跳过处理示例
const res = await axios.post(
  `${process.env.REACT_APP_BACKEND}/users/signup`,
  formData,
  {
    transformRequest: (data) => data
  }
)

• 不要手动添加Content-Type: multipart/form-data请求头，浏览器会自动为FormData请求添加该头并携带正确的boundary分隔符，手动指定会导致boundary缺失，后端无法正常解析请求体。
• 检查是否存在请求拦截器强制修改了请求体、请求头，导致FormData格式被破坏。

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