Remix/Node.js下通过Axios向Django上传文件失败问题求助

问题 #

我们有一个Remix应用，需要将接收的文件上传转发至Django后端（Django REST Framework），但Django后端无法接收到请求中的任何数据。

Remix后端的action处理代码如下：

export const action = async ({ request }: ActionFunctionArgs) => {
  const user = await auth.isAuthenticated(request, {
    failureRedirect: paths.login,
  });

  const uploadHandler = unstable_createMemoryUploadHandler({
    maxPartSize: 500_000,
  });

  const formData = await unstable_parseMultipartFormData(
    request,
    uploadHandler,
  );

  const response = await axios.post("/assets/upload/", formData, {
    headers: {
      "Content-Type": "multipart/form-data",
    },
  });
};

调试发现formData内容正常，包含"myFile"条目，但Content-Length头部未自动生成，Django接收到的Content-Length值为0，不过Content-Type头部已自动添加boundary。

我们尝试了多种修复方案：将FormData中的文件转为Blob后重新构建FormData；使用form-data库创建新FormData并手动设置Content-Length；不设置任何头部让Axios自动处理（此时Axios将Content-Type设为application/json），但均未解决问题。

解决思路 #

• 移除手动设置的Content-Type头部：手动指定multipart/form-data会干扰Axios自动生成带正确boundary的Content-Type，同时导致它无法计算Content-Length。直接删除headers中的该配置，让Axios根据FormData自动处理请求头。
• 更换Remix的上传处理器：unstable_createMemoryUploadHandler可能存在文件内容读取不完整的情况，临时改用unstable_createFileUploadHandler将文件存到磁盘，再从磁盘读取文件重新加入FormData后转发，验证文件数据是否完整。
• 直接转发原始请求流：跳过Remix的FormData解析步骤，直接将原始request的body流转发给Django，保留原始请求的Content-Type（带boundary）和其他必要头部，示例代码：

  const response = await axios.post("/assets/upload/", request.body, {
    headers: {
      ...request.headers,
      Authorization: `Bearer ${user.token}` // 按需添加身份验证头部
    }
  });
  

• 检查文件对象格式：确认FormData中的文件是标准的File/Blob类型，检查其size、name属性是否正常。若为Remix解析后的非标准对象，重新包装成符合Fetch规范的File对象再加入FormData。
• 验证Django后端配置：确认Django的MAX_UPLOAD_SIZE设置足够容纳上传文件，同时DRF的解析器类已包含MultiPartParser和FormParser，确保后端能正确解析multipart类型请求。

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