django使用fetch上传文件

在上一篇文章中,我包装了fetch方法,使其携带cookie。但是之前fetch传递的是json数据,现在有了一个上传文件的需求,因此需要进行修改:

js 复制代码
const sendRequest = (url, method, data) => {
  const csrftoken = Cookies.get('csrftoken')
  const options = {
    method: method,
    headers: {
      'X-CSRFToken': csrftoken,
      // 'Content-Type': 'multipart/form-data', //这里可以是application/json,后端需要方式二获取参数
      withCredentials: true //跨域时携带cookie
    },
    credentials: 'include', //要求携带cookie,否则无法维持会话
  }
  if (method != 'GET' && data && Object.keys(data).length > 0) {
    if (data instanceof FormData) {
      options.body = data
    }
    else {
      let formdData = new FormData()
      for (let key in data) {
        let value = data[key]
        if (value instanceof Object
          && !(value instanceof File)
          && !(value instanceof Blob)) {
          value = JSON.stringify(value)
        }
        formdData.append(key, value)
      }
      options.body = formdData
    }
  }
  return fetch(`http://localhost:8000/${url}`, options)
}

这里还是选择使用formData进行传递数据,一是django可以从POST.get(key)直接获取参数,如果是浅层的就不需要额外json.parse 了,二是json传输文件需要base64,可能有性能损失。

注意

这里注意了,不要header中不要设置Content-Type,否则上传失败。

这是因为header中包含了一段boundary指明文件的间隔。可以看下成功的请求头:

在后端就从request.FILES.get(key)获取文件,从request.POST.get(key)获取其他参数。

在传参的时候,还是直接传递一个json就可以,然后将其处理为FormData格式。

相关推荐
好开心啊没烦恼24 分钟前
Python 数据分析:计算,分组统计1,df.groupby()。听故事学知识点怎么这么容易?
开发语言·python·数据挖掘·数据分析·pandas
lljss20201 小时前
Python11中创建虚拟环境、安装 TensorFlow
开发语言·python·tensorflow
空中湖1 小时前
tensorflow武林志第二卷第九章:玄功九转
人工智能·python·tensorflow
CodeCraft Studio2 小时前
CAD文件处理控件Aspose.CAD教程:使用 Python 将绘图转换为 Photoshop
python·photoshop·cad·aspose·aspose.cad
ZWZhangYu4 小时前
LangChain 构建向量数据库和检索器
数据库·langchain·easyui
Python×CATIA工业智造4 小时前
Frida RPC高级应用:动态模拟执行Android so文件实战指南
开发语言·python·pycharm
onceco5 小时前
领域LLM九讲——第5讲 为什么选择OpenManus而不是QwenAgent(附LLM免费api邀请码)
人工智能·python·深度学习·语言模型·自然语言处理·自动化
feifeigo1235 小时前
升级到MySQL 8.4,MySQL启动报错:io_setup() failed with EAGAIN
数据库·mysql·adb
狐凄5 小时前
Python实例题:基于 Python 的简单聊天机器人
开发语言·python
悦悦子a啊6 小时前
Python之--基本知识
开发语言·前端·python