实现 Browser 客户端下载 XML 文件功能

后端

  1. 使用 io.BytesIO 方法 创建一个字节缓冲区在不需要磁盘文件的情况下进行文件操作
  2. 打包为 zip 压缩包(上图代码)
  3. in_memory_zip.seek(0) 数据写入ZIP后文件指针会停留在缓冲区的末尾将文件指针重置回开头
  4. make_response() 方法用于创建HTTP响应的函数
  5. .getvalue() 方法返回内存中ZIP文件的完整内容返回给客户端
  6. Content-Disposition : 告诉浏览器或客户端这个响应应该被当作一个附件来处理
  7. Content-Type : 告诉浏览器或客户端响应体包含的是一个ZIP格式的文件

前端

接口部分

responseType: 'blob' 作用 : 服务器响应的内容将被自动处理为一个BLOB对象,随后可以被用来创建下载链接,允许用户下载从服务器接收的二进制数据 重点

代码

打印 blob 为:

URL.createObjectURL() 方法返回一个 DOMString,它是一个临时的、唯一的 URL,指向你提供的 BLOB 或 File 对象

使用 JS 的 document.createElement('a') 方法创建一个临时的元素用来从客户端触发下载

a.href = url 它的 href 属性就是刚才创建的临时 URL

URL.revokeObjectURL(url) 清理通过 URL.createObjectURL() 方法创建的 URL 必要!!!

相关推荐
NUC_Dodamce1 小时前
Cocos3x 解决同时勾选 适配屏幕宽度和 适配屏幕高度导致Widget组件失效的问题
开发语言·javascript·ecmascript
JSON_L2 小时前
Vue 电影导航组件
前端·javascript·vue.js
xptwop3 小时前
05-ES6
前端·javascript·es6
Heo3 小时前
调用通义千问大模型实现流式对话
前端·javascript·后端
前端小巷子4 小时前
深入 npm 模块安装机制
前端·javascript·面试
深职第一突破口喜羊羊5 小时前
记一次electron开发插件市场遇到的问题
javascript·electron
cypking5 小时前
electron中IPC 渲染进程与主进程通信方法解析
前端·javascript·electron
西陵5 小时前
Nx带来极致的前端开发体验——借助playground开发提效
前端·javascript·架构
江城开朗的豌豆5 小时前
Element UI动态组件样式修改小妙招,轻松拿捏!
前端·javascript·vue.js
float_六七6 小时前
JavaScript:现代Web开发的核心动力
开发语言·前端·javascript