vue/js实现文件流下载，文件下载进度监听

 /*** 文档下载（通过文档请求，直接下载文档）* url 请求路径* fileName 下载名称* size 文件大小*/loadDown (url, fileName, size) {var _this = thisvar xhr = new XMLHttpRequest()xhr.open('GET', url, true) // 也可以使用POST方式，根据接口xhr.responseType = 'blob'xhr.onprogress = function (event) {// 用于监听下载进度，需要知道文件大小if (event.loaded === size) {_this.downloadLoading = false}        }xhr.onload = function () {if (this.status === 200) {var content = this.responsevar aTag = document.createElement('a')var blob = new Blob([content])aTag.download = fileNameaTag.href = URL.createObjectURL(blob)aTag.click()URL.revokeObjectURL(blob)}}xhr.send()}/***request请求，获取文件地址*/async handlePreview (file) {var _this = thisvar xhr = new XMLHttpRequest()// 第一步：新建对象xhr.open('GET', file.url, true)// 第二步：打开连接  将请求参数写在url中xhr.send()// 第三步：发送请求  将请求参数写在URL中/*** 获取数据后的处理程序*/xhr.onreadystatechange = function (res) {if (xhr.readyState === 4 && xhr.status === 200) {var str = xhr.responseText// 获取到json字符串，解析str = JSON.parse(str)        _this.loadDown(str.d, file.name)}}},

vue/js实现文件流下载，文件下载进度监听相关推荐

vue axios 实现文件流下载（前后端分离跨域问题的解决）
前端代码后端以流的形式返回单个文件下载 @RequestMapping(value = "download", method = RequestMethod.POST)@Api ...
js中文件流下载导出excel文件方法
需求:数据列表导出为excel文件,通过向后台请求接口,返回的结果一般有两种方式: 1. 后台返回excel文件http地址(后台会在服务器生成,前端请求url再下载一遍,浪费服务器资源,优点:前端处 ...
vue 后端返回文件流下载文件
效果: 举例下载"E:\test\jn_ceshi1202.txt" 则前端realPath="E:\test\jn_ceshi1202.txt" 前端: do ...
js实现文件流下载文件
window.location.href的用法 javascript中的location.href有很多种用法,主要如下.self.location.href="/url" 当前页 ...
Vue中实现文件流格式图片预览
需求:后端接口返回文档流格式图片,如何在页面中显示显示并预览? 思路: 设置 axios responseType: 'blob':传送门:JavaScript Blob 对象详解 URL.creat ...
基于OkHttp 、Retrofit 、Volley 、RxJava、Novate多种网络框架整合的快速项目开发框架，一行代码实现Ftp文件上传、文件下载、文件删除和进度监听的工具类的使用
基于OkHttp .Retrofit .Volley .RxJava.Novate多种网络框架整合的快速项目开发框架,Ftp文件上传.文件下载的工具类的使用. 依赖于Ftp的jar包,对上传.下载.删 ...
vue 将文件url 改成文件流下载
vue 将后台返回文件url 改成文件流下载由于直接a 标签下载视频,音频会打开新的窗口,所以改用文件流下载一.图片 exportData(row) {console.log('row', row ...
vue上传zip文件到服务器,vue.js zip文件上传
vue.js zip文件上传内容精选换一换开发过程中,您有任何问题可以在github上提交issue,或者在华为云对象存储服务论坛中发帖求助.接口参考文档详细介绍了每个接口的参数和使用方法.在O ...
前端通过后端返回文件流下载文件
// 把文件流下载下来 const downloadMethods = (name, res) => {const blob = new Blob([res.data], { type: 'ap ...

vue/js实现文件流下载，文件下载进度监听

vue/js实现文件流下载，文件下载进度监听相关推荐

最新文章

热门文章