当前位置: 首页 > news >正文

django使用fetch上传文件

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

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格式。

http://www.lryc.cn/news/362473.html

相关文章:

  • linux安装docker步骤
  • Unity DOTS技术(一)简介
  • 深度解读ChatGPT基本原理
  • python实现——分类类型数据挖掘任务(图形识别分类任务)
  • 【安卓跨进程通信IPC】-- Binder
  • 大数据之Schedule调度错误(一)
  • DiffIR论文阅读笔记
  • prometheus+alertmanager+webhook钉钉机器人告警
  • ctfshow 年CTF web
  • 原型链、闭包、手写一个闭包函数、 闭包有哪些优缺点、原型链继承
  • linux中SSH_ASKPASS全局变量的作用
  • 9 -力扣高频 SQL 50 题(基础版)
  • TCP的重传机制
  • pg 数据库,获取时间字段值的具体小时,赋值给其他字段
  • 做视频号小店什么类目最容易爆单?其实,弄懂这三点就会选品了
  • Nginx作为下载站点
  • vue3简单快速实现主题切换功能
  • 国联易安:网络反不正当竞争,要防患于未然
  • Linux 网络配置 01
  • 快速入门C++正则表达式
  • java —— 缓冲字符输入流/缓冲字符输出流
  • blender从视频中动作捕捉,绑定到人物模型
  • 掘金滑块验证码安全升级,继续破解
  • 数据结构练习题——Java实现
  • 行为设计模式之状态模式
  • 找回以前的视频:技术与实践3个指南
  • GCN 代码解析(一) for pytorch
  • 2024年云计算、信号处理与网络技术国际学术会议(ICCCSPNT 2024)
  • 希尔排序法
  • thinkphp6.0版本下子查询sql处理