DRF报Multipart form解析错误：Invalid boundary in multipart: None求解决

问题根源 #

前端代码里手动指定了Content-Type: multipart/form-data，这会覆盖浏览器自动生成的、包含正确boundary的请求头。当FormData作为请求体时，浏览器会自动生成带动态boundary的Content-Type，手动设置会导致后端无法识别正确的表单分隔符，从而触发Multipart form parse error - Invalid boundary in multipart: None错误。

修复后的前端代码 #

<body>
  <input id="fileRef" type="file" />
  <button onclick="push()">Push</button>

  <script>
    function push() {
      const file = fileRef.files[0];
      const formData = new FormData();
      formData.append('image', file, file.name);

      fetch('http://127.0.0.1:8000/api/item/', {
        method: 'POST',
        body: formData
        // 移除手动设置的Content-Type头，浏览器会自动处理请求头的生成
      });
    }
  </script>
</body>

补充说明 #

• 后端配置的MultiPartParser是正确的，无需修改。
• 手动硬编码boundary不可行，因为浏览器生成的boundary是动态随机的，硬编码值几乎不可能和实际请求的匹配，所以完全不需要手动设置这个请求头。

内容的提问来源于stack exchange，提问作者Yernar.T