上传图片时遇503错误，BE及Postman请求均正常

1. 检查请求库的默认请求头设置 #

你的Api(service)封装（比如Axios实例）如果默认配置了Content-Type: application/json，会覆盖FormData自动生成的multipart/form-data请求头，导致后端无法解析表单数据，这很可能是503错误的根源。

修复方案：
在create请求中显式移除默认的Content-Type，让浏览器自动处理表单的请求头：

return Api(service).post(route, formData, {
  headers: {
    Accept: "application/json",
    // 让FormData自动生成带boundary的Content-Type
    "Content-Type": undefined,
  },
});

2. 对齐create与update的字段处理逻辑 #

对比两个方法的字段映射逻辑：

• create处理的是category字段，update处理的是category_name字段并映射为category
• 后端create接口对category参数的要求（是id还是名称）必须和update保持一致，否则会导致参数不匹配

比如如果后端期望category是名称，修改create里的category处理逻辑，和update对齐：

if (key === "category") {
  let categoryValue;
  if (typeof data[key] === "object" && data[key] !== null) {
    categoryValue = data[key].name || ""; // 只取name字段，和update逻辑统一
  } else {
    categoryValue = data[key];
  }
  formData.append("category", categoryValue);
}

3. 验证FormData的字段完整性与格式 #

打开浏览器DevTools的Network面板，对比create请求和Postman成功请求的细节：

• 检查所有字段的名称、值是否完全匹配
• 确认图片文件是否正确携带（查看Request Payload中的file部分）
• 确认请求头的Content-Type是否包含正确的boundary（格式应为multipart/form-data; boundary=----WebKitFormBoundaryxxxx）

4. 调整布尔字段的处理方式 #

is_top_product是布尔类型，你当前用toString()转成了"true"/"false"字符串，部分后端可能不接受这种格式，可改为直接传递原始布尔值：

else {
  // 布尔值直接append，避免转字符串导致的类型不匹配
  formData.append(key, typeof data[key] === 'boolean' ? data[key] : data[key].toString());
}

5. 确认create接口的路由与请求方法 #

检查route变量在create和update中的值是否正确，确保create请求的URL和Postman中使用的完全一致，没有拼写错误或路径差异。

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