推荐!!!前端将url转成blob和blob转成url;前端将文件流读取成url;前端将blob文件读取出url预览和下载

一般后端返回的地址,前端通过返回blob读取出url,然后使用a标签下载
这里是引用

方式一:通过接口将后端返回的文件流blob读取出url(推荐推荐

    downLoadFileImg (fileUrl, fileName) {// 可下载,名称也有效 -- 推荐const x = new window.XMLHttpRequest()x.open('GET', fileUrl, true)x.responseType = 'blob' // 选择返回格式为blobx.onload = () => {const url = window.URL.createObjectURL(x.response) //将后端返回的blob文件读取出urlconsole.log('blob====',x.response)console.log('url====',url)// url可以预览和下载const a = document.createElement('a')a.href = urla.download = fileNamea.click()}x.send()},

方式二:不需要文件名,只需要文件地址(推荐推荐

      let elemIF = document.createElement("iframe")elemIF.src = G_CGI_PHP.invoiceApi.downLoadUrlconsole.log(elemIF.src)elemIF.style.display = "none"document.body.appendChild(elemIF)

方式三:前端上传文件读取文件blob获取url

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

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

相关文章

CH340电路设计

最近选用USB转串口芯片进行开发调试,在调研了各主流芯片的之后,觉得 CH340 系列的性价比很高,而且技术支持在国内,如果遇到问题解决起来也会方便很多。但是 CH340 / CH341 型号很多,具体选型就就该结合需求和芯片手册了…

vue拖拽列表----vuedraggable组件;ElementUI 实现Table组件实现拖拽效果

vue-draggable中文文档 简单的遍历list列表拖拽 部分元素不可拖拽参考&#xff1b; 部分不可拖拽参考 ElementUI 实现Table组件实现拖拽效果 列表的拖拽功能&#xff1a; 一、下载依赖 npm i -S vuedraggable二、页面使用 <template><div><vuedraggable cla…

filters获取data中的数据;filters使用data中的数据

如果直接在filters中通过this引入data数据&#xff0c;则无效获取不到。 可以通过filter方法传值 来获取data的数据使用 <div >{{formInline.bjthObj.insuranceCompanyName | CompanyVal(cops)}}</div>data () {return {insuranceCompanyName: ,cops:[],}}filters:…

spring MVC配置详解

From: http://www.cnblogs.com/superjt/p/3309255.html 现在主流的Web MVC框架除了Struts这个主力 外&#xff0c;其次就是Spring MVC了&#xff0c;因此这也是作为一名程序员需要掌握的主流框架&#xff0c;框架选择多了&#xff0c;应对多变的需求和业务时&#xff0c;可实行…

Altium Designer如何画虚线

流程如下&#xff1a; 在原理图上右键 --> Place --> Drawing Tools --> Line&#xff0c;在画线的时候按 Tab 键&#xff0c;然后将 Line Style 改为 Dashed&#xff0c;就可以画虚线了。

node.js 和 HTML5-Canvas 结合实现截图上传交互

楼主要做一个简单的图片上传服务器&#xff0c; node.js实现服务端&#xff0c; 页面使用HTML5-Canvas实现截图。 为什么用Nodejs呢&#xff0c;因为用Js写后台很爽-。- 而且比较简单 为什么用canvas呢&#xff0c;其实我不想用的 因为有些低版本的IE对HTML5的支持不好&#xf…

通过文件url地址获取base64;通过图片url地址获取base64;js获取文件的base64

本篇是通过url地址获取文件的base64 如果想要通过File文件获取base64查看这篇 以下代码可直接复制使用&#xff01;注意第9行的图片地址更改下 <template><div class"content"><div>获取图片的base64</div><input type"file" …

FineReport报表和J2EE应用的集成

From: http://www.blogjava.net/fannie/archive/2013/05/08/398985.html FineReport是一个纯Java软件&#xff0c;因此对于J2EE的项目&#xff0c;可以做到无缝集成。 报表服务器并非物理概念的服务器&#xff0c;而是以一个标准的J2EE应用的形式或者jar包的形式提交给程序。应…

vue使用jszip和file-save下载文件并打包;vue前端下载多个文件b并打包;

场景&#xff1a; 一般是后端直接将多个文件打包好&#xff0c;前端调用下载地址下载打包&#xff1b;但是文件太多会导致下载接口时间过长和服务器爆掉&#xff1b;故采用前端先将多个文件下载然后进行打包&#xff1b; 注意点&#xff1a; 1.先获取所有下载的文件路径和包含后…

【BZOJ1085】骑士精神

迭代加深搜索。 剪枝&#xff1a;当满足以下任意一个条件退出&#xff1a; 1.当前已搜到答案时&#xff08;ans!-1||sum0&#xff09; 2.剩余步数1<当前局面与目标局面不同的格子数sum 时&#xff08;因为n步最多改变n1个格子&#xff09; 3.当前步数>当前规定最大步数时…

CH340电路设计注意事项

在前面两篇博客提到了CH340的电路设计以及芯片选型&#xff0c;本文将重点放在使用CH340芯片进行电路设计的一些细节与注意事项。 电压匹配问题 CH340 芯片通过 USB 转换出来的 TTL 串口输出和输入电压是根据芯片供电电压是自适应的。也即&#xff0c;如果芯片是 5V 供电&…

解决 Visual Studio 中代码注释自动折叠的问题

今天突发奇想&#xff0c;打算把存储过程以注释的形式放在代码中进行版本管理&#xff0c;比如下面的代码&#xff1a; 由于存储过程很长&#xff0c;注释占了很多行&#xff0c;严复影响了正常代码的排版与阅读体验。之前也遇到过这样的场景&#xff0c;当时通过手动添加regio…

Newtonsoft.Json高级用法

From: http://www.cnblogs.com/yanweidie/p/4605212.html 手机端应用讲究速度快&#xff0c;体验好。刚好手头上的一个项目服务端接口有性能问题&#xff0c;需要进行优化。在接口多次修改中&#xff0c;实体添加了很多字段用于中间计算或者存储&#xff0c;然后最终用Newtonso…

Android 经典示例,初学者的绝好源码资料

2019独角兽企业重金招聘Python工程师标准>>> Android 经典示例&#xff0c;初学者的绝好源码资料 附上源码&#xff1a; 转载:http://www.adobex.com/android/source/details/00000374.htm 转载于:https://my.oschina.net/androidcode/blog/104696

CH340 Linux驱动使用教程

在官方Linux内核版本中自Kernel2.6以后就默认包含了对CH340/CH341芯片的驱动支持了&#xff0c;但比较遗憾的是该自带驱动版本较老&#xff08;由开源社区开发者提交&#xff09;已不能满足使用需求了&#xff0c;因此我们需要用芯片官网提供的新驱动进行替换链接。 1. 首先去…

h5开发实时预览;真机调试开发;拼接ip的地址直接微信打开或者浏览器打开也可以实时预览

http://192.168.10.135:2277/#/Write1 本地启动vue项目 将地址栏复制 放在微信开发者工具 可以借助微信开发者工具预览 找到自己电脑的ip 也可以电脑输入自己的ip和对应端口号地址进行预览 最后将拼接ip和端口号的地址直接微信打开或者浏览器打开也可以实时预览

python基础2

本节内容 列表、元组操作字符串操作字典操作集合操作文件操作字符编码与转码 一、列表、元组操作 列表是我们最以后最常用的数据类型之一&#xff0c;通过列表可以对数据实现最方便的存储、修改等操作 定义列表 >>> name [hongpeng,21,ops] 通过下标访问列表中的元素…

element-ui嵌套弹框遮罩层解决

:modal-append-to-body“false” :append-to-body“true” 嵌套的 Dialog 必须指定该属性并赋值为 true <template><el-button type"text" click"outerVisible true">点击打开外层 Dialog</el-button><el-dialog title"外层 D…

Linux 串口调试工具汇总

在 linux 系统下进行串口调试或者开发时配合简单易用的串口调试工具那是必不可少。这篇博客对当前用的较多的&#xff0c;且我自己经常用的一些串口工具做一下汇总&#xff0c;大家可以参考一下。 实验环境&#xff1a; OS: Ubuntu16.04 Kernel: 4.4.0 --------------------…

[翻译] effective go 之 Names Semicolons

2019独角兽企业重金招聘Python工程师标准>>> Names Names are as important in Go as in any other language. In some cases they even have semantic effect: for instance, the visibility of a name outside a package is determined by whether its first cha…