fetch请求失败未达服务器，报Object2不可迭代及422错误求助

核心问题分析 #

422错误源于请求格式不符合后端解析要求，结合你在Node.js环境（Next.js API路由）使用FormData的场景，主要问题集中在Next.js默认bodyParser与FormData的冲突、请求头未正确设置两点；axios的“Object不可迭代”错误则是FormData传递或头配置不当导致的。

具体解决方案 #

• 禁用Next.js默认bodyParser
  Next.js默认的bodyParser会自动解析JSON/urlencoded类型请求，但无法处理multipart/form-data格式的FormData，直接禁用即可：

  export const config = {
    api: {
      bodyParser: false, // 关键：禁用默认解析，让FormData自行处理
    },
  };
  

• 为fetch请求添加正确的请求头
  Node.js环境下的fetch不会自动生成FormData所需的带boundary的Content-Type，需要用form-data库的getHeaders()方法手动获取：

  const response = await fetch(URL, {
    method: 'POST',
    headers: formData.getHeaders(), // 生成符合要求的请求头
    body: formData,
  });
  

• 修复axios的迭代错误
  使用axios时，同样要借助getHeaders()设置请求头，且不要手动指定Content-Type（避免缺少boundary）：

  const response = await axios.post(URL, formData, {
    headers: formData.getHeaders(),
  });
  

  同时要确保formData是FormData类的实例，不要传递普通对象，否则会触发迭代错误。

• 核对字段名与后端一致性
  422错误也可能是字段名拼写错误，比如后端期望withoutBgImageBase64而你传的是withoutbg_image_base64，必须完全匹配后端接口定义的字段名。

• 验证base64数据格式
  检查withoutbg_image_base64是否为合法的base64字符串，部分后端要求去掉data:image/png;base64,前缀才能解析，格式错误也会导致422。

修改后的完整代码示例 #

import axios from 'axios';
const FormData = require('form-data');

export const config = {
  api: {
    bodyParser: false,
  },
};

async function uploadFile(
  prompt,
  withoutbg_image_base64,
  randID,
  username,
  model_name
) {
  const formData = new FormData();
  formData.append('prompt', prompt);
  formData.append('withoutbg_image_base64', withoutbg_image_base64);
  formData.append('randID', randID);
  formData.append('username', username);
  formData.append('model_name', model_name);
  
  try {
    // fetch 版本
    const response = await fetch(URL, {
      method: 'POST',
      headers: formData.getHeaders(),
      body: formData,
    });

    // 可选：axios 版本
    // const response = await axios.post(URL, formData, {
    //   headers: formData.getHeaders(),
    // });

    const data = await response.json();
    return data;
  } catch (error) {
    console.error(error);
    throw error; // 建议抛出错误让上层处理，而非返回空对象
  }
}

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