如何将文件从 Axios 上传到 Django？

Posted 2023-02-24

【中文标题】如何将文件从 Axios 上传到 Django？

【英文标题】：How do I upload a file from Axios to Django?

【发布时间】：2018-09-01 05:31:03

【问题描述】：

我正在从 Jquery AJAX 切换到 react-dropzone 和 Axios，我想将文件上传到我的 Django 服务器，我在服务器上发布图像的 blob url 没有问题，但我想得到它在request.FILES 下，但我得到一个空查询集。

request.FILES : <MultiValueDict: >  <!--- empty
request.POST  : <QueryDict: >       <!--- able to get a blob url

---

这是我的 axios 配置的样子：

const temporaryURL = URL.createObjectURL(step3.drop[0]);

var fd = new FormData();
fd.append('image', temporaryURL);

axios(
  method: 'post',
  url: SITE_DOMAIN_NAME + '/business-card/collect/',
  data: fd,
  headers: 
    "X-CSRFToken": CSRF_TOKEN, 
    "content-type": "application/x-www-form-urlencoded"
  
).then(function (response) 
  console.log(response)
  URL.revokeObjectURL(temporaryURL);
).catch(function (error) 
  console.log(error)
);

我在基于 POST 请求的 classBasedView 上接收文件。

如何上传文件？我哪里错了？

编辑

我也试过“application/form-data”，没有解决问题

【参考方案1】：

问题来自content-type，因为它使用的是"application/form-data" 而不是"multipart/form-data"。

【讨论】：

如何使用axios.post(url, data, config) 做到这一点？

@JChao 同上，将url 替换为您的端点，data 替换为有效负载，config 替换为标头。

我试过了。似乎Django一旦传递就无法找到文件数据。我想知道我的标题是否错误，但在data 中设置内容类型对我没有帮助。我的应用程序仍在使用 angularJS。我们使用ngf-drop 库来处理拖放。当我 console.log 我的data 时，我可以在那里看到该文件，但是在发送到 Django 之后，该文件消失了。你知道这里发生了什么吗？

@JChao content-type 应该在标题中，而不是在 data 中。你发送json或使用FormData对象是什么类型的数据？

我想我需要将我的对象中的所有东西一一追加到FormData对象中。还是在这里试一下。感谢您的帮助