flask后端+vue前端——后端怎么发文件给前端?

首先,前端axios请求的responseType要设置为blob

const service = axios.create({baseURL: 'http://127.0.0.1/api',timeout: 5000});//向后端发送数据,后端根据这个数据data生成文件返回send_coordinate(data){return service.post('/',data,{responseType: 'blob'});}

然后,后端要返回文件字节流

from flask import Flask,Response@app.route('/', methods=['POST'])
def coordinate():res = request.form['data'] # 取前端数据# 保存为txt文件with open("1.txt", 'w', encoding='utf-8') as f:  f.write(data) # 以字节方式读取with open(filename, 'rb') as f:bytes_data = f.read()# 用Response对象构造返回值,需要指定文件类型return Response(bytes_data, mimetype="text/plain")

接着,前端在axios的then中,把res.data转为Blob对象,然后创建URL,赋值给a标签的href属性

user.send_coordinate(formData).then(res=>{let blob = new Blob([res.data], {type: 'text/plain'}); //这一步是关键this.downloadURL=URL.createObjectURL(blob) // 生成临时URL,赋值给变量this.filedownload=true // 标记变量,显示a标签(下载链接)})

最后,a标签与vue变量如下

<a v-if="filedownload" :href="downloadURL" download="coordinate.txt">下载轨迹文件</a>
export default {name: 'PickTrack',data() {return {filedownload:false,   //是否有文件可下载downloadURL:''        //临时下载链接}},

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/50194.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

c++栈笔记

一种常见的数据结构&#xff0c;遵循后进先出&#xff0c;先进后出的原则。地址不连续&#xff0c;栈顶&#xff08;top&#xff09; 1.常见函数 stack<int> s;定义一个参数类型为int 的栈 名为ss.push()向栈中插入元素s.emplace()压栈&#xff0c;无返回值s.pop()删除…

@SpingFrameWork

SpingFrameWork 一、技术体系结构 单一架构&#xff0c;一个大的项目&#xff0c;一个工程&#xff0c;导出war包在一个tomcat上运行&#xff08;主要用spring、springMVC、Mybatis&#xff09;分布式架构&#xff0c;一个项目&#xff0c;但是有多个模块&#xff0c;但是每个…

摆脱想得太多做得太少的困境,拥抱财富与成功

在生活的舞台上,我们常常目睹这样的场景:有些人怀揣着美好的梦想和周全的计划,却始终未能迈出实质性的步伐,最终被困顿的现状所束缚。就如同那位卖豆腐的人,每日在夜里为自己编织着绚烂的未来蓝图,却在黎明来临时,依旧重复着昨日卖豆腐的生活,一辈子在原地徘徊,无法挣…

Servlet2-HTTP协议、HttpServletRequest类、HttpServletResponse类

目录 HTTP协议 什么是HTTP协议 HTTP协议的特点 请求的HTTP协议格式 GET请求 POST请求 常用的请求头说明 哪些是GET请求&#xff0c;哪些是POST请求 响应的HTTP协议格式 常见的响应码说明 MIME类型说明 HttpServletRequest类 作用 常用方法 如何获取请求参数 po…

IP 泄露: 原因与避免方法

始终关注您的IP信息&#xff01; 您的IP地址不仅显示您的位置&#xff0c;它包含几乎所有的互联网活动信息&#xff01; 如果出现IP泄漏&#xff0c;几乎所有的信息都会被捕获甚至非法利用&#xff01; 那么&#xff0c;网站究竟如何追踪您的IP地址&#xff1f;您又如何有效…

Layui---输入事件

输入实时监听 //监听表单单选框复选框选择 form.on(radio, function (data) {console.log(data.value); //得到被选中的值 });//监听表单下拉菜单选择form.on(select, function (data) //监听表单下拉菜单选择form.on(select, function (data) ​ //监听表单复选框选择form.…

从0开始的STM32HAL库学习9

定时器输入捕获测频率 生成待测信号 配置环境 选择如上图所示 代码修改 在main函数中加入 HAL_TIM_PWM_Start(&htim2,TIM_CHANNEL_1); 测量信号频率 配置环境 如图所示打开TIM3定时器 1. 设置TI1FP1为ResetMode,即清空计数 2. 使用内部时钟 3. 通道 1 设置为输…

日本的便利店真的“无所不能”?!简直不要太方便了

众所周知&#xff0c;日本便利店可谓是日本人离不来的存在了&#xff01;真真是“要啥有啥”&#xff0c;可以说日本的便利店才是真正意义上的“便利”~ 那日本的便利店到底有什么与众不同呢&#xff1f;&#xff1f;今天小编来带大家盘点一下日本便利店的那些服务。 一、购票…

Python学习计划——5.2继承、多态和封装

面向对象编程的三个重要概念是继承、多态和封装。它们使得代码更具可重用性、灵活性和安全性。以下是详细的讲解和Python案例。 1. 继承 继承允许一个类&#xff08;子类&#xff09;从另一个类&#xff08;父类&#xff09;继承属性和方法。通过继承&#xff0c;子类可以复用…

《2024新质生产力引领下十大重点产业趋势解读--大模型篇》,深剖当下爆火的大模型产业!

01 报告导读 “新质生产力”重要性再提升。 近日&#xff0c;作为热词的“新质生产力”再度被多次提及&#xff0c;“新质生产力”这一概念近年来在经济和社会发展中被频繁提及&#xff0c;它指的是通过创新驱动&#xff0c;利用新技术、新业态、新模式推动生产力发展的新形态…

深入解析Memcached:C#中的应用与实战案例

目录 Memcached简介Memcached的特点Memcached的工作原理Memcached的应用场景Memcached的安装和配置Memcached与C#的集成 引入依赖配置Memcached客户端C#代码示例 存储数据读取数据删除数据深入解析Memcached 数据存储和过期策略分布式架构性能优化实战案例 缓存数据库查询结果实…

opencascade AIS_MouseGesture AIS_MultipleConnectedInteractive源码学习

AIS_MouseGesture //! 鼠标手势 - 同一时刻只能激活一个。 enum AIS_MouseGesture { AIS_MouseGesture_NONE, //!< 无激活手势 // AIS_MouseGesture_SelectRectangle, //!< 矩形选择&#xff1b; //! 按下按钮开始&#xff0c;移动鼠标定义矩形&…

CSP-J12023入门级第一轮错题

CSP-J12023入门级第一轮 假设有一个链表的节点定义如下&#xff1a; struct Node {int data;Node* next; };现在有一个指向链表头部的指针&#xff1a;Node* head。如果想要在链表中插入一个新节点&#xff0c;其成员data的值为42&#xff0c;并使新节点成为链表的第一个节点&…

SQL语句补充与示例

在工作中对一些sql感觉陌生&#xff0c;补充一下学习。 SQL语句补充与示例 SQL&#xff08;Structured Query Language&#xff0c;结构化查询语言&#xff09;是一种用于管理和操作关系数据库的标准编程语言。SQL 语句用于执行各种数据库操作&#xff0c;包括查询、更新、插…

【Linux】玩转操作系统,深入刨析进程状态与调度机制

目录 1. 进程排队2. 进程状态的表述2.1. 进程状态2.2 运行状态2.3. 阻塞状态2.4. 挂起状态 3. Linux下具体的进程状态3.1. 运行状态R3.2. 可中断睡眠状态S3.3. 不可中断睡眠状态D3.4. 停止状态T3.5. 死亡状态X3.6. 僵尸状态Z 4. 孤儿进程5. 优先级6. Linux的调度与切换6.1. 四个…

基于STM32设计的老人摔倒检测系统(4G+华为云IOT)(193)

文章目录 一、前言1.1 项目介绍【1】项目功能介绍【2】项目硬件模块组成1.2 设计思路【1】整体设计思路【2】整体构架【3】上位机开发思路【4】供电方式1.3 项目开发背景【1】选题的意义【2】可行性分析【3】参考文献【4】课题研究的意义【5】国内外技术发展现状【6】课题研究思…

在linux上面用drissionpage自动化遇到反爬?

目录 一、反爬内容1、案例12、案例2 二、后来发现的问题解决 一、反爬内容 1、案例1 反爬的响应文本返回如下&#xff1a;爬虫均能精准识别,测试链接:https://ziyuan.baidu.com/crawltools/index)非正常爬虫访问时:返回的压缩报文内容无法直接识别,可一定程度上保护站点信息安…

C语言进阶——一文带你深入了解“C语言关键字”(中篇)

本篇文章属于C语言进阶篇的“C语言关键字”&#xff0c;旨在分享我对C语言关键字的深度学习和了解。同时带领大家深入浅出的走进C语言进阶知识——关键字篇&#xff01; 目录 一、变量的命名规则 二、标识符的命名规则 一、变量的命名规则 1、命名应当直观且可以拼读&#x…

【YashanDB知识库】yasdb jdbc驱动集成BeetISQL中间件,业务(java)报autoAssignKey failure异常

问题现象 BeetISQL中间件版本&#xff1a;2.13.8.RELEASE 客户在调用BeetISQL提供的api向yashandb的表中执行batch insert并将返回sequence设置到传入的java bean时&#xff0c;报如下异常&#xff1a; 问题的风险及影响 影响业务流程正常执行&#xff0c;无法获得batch ins…

数据库中单表的查询(select)

单表查询 所有的查找都会得到一张虚拟表 一、 最简单的查询 SELECT 123; SELECT asd; SELECT 11;二、 从表中获取数据 select 字段名,字段名 from 表名 2.1 全字段查询 SELECT sid,sname,birthday,ssex,classid FROM student; SELECT * FROM student; -- 使用*不利于s…