H5 几种常见下载方式

H5 几种常见下载方式

方法一:download属性

下载

download="5332.gif" 为指定下载名称

方法二:window.location.href

window.location.href = 'http://imtt.dd.qq.com/16891/26747DD8B125A8479AD0C9D22CA47BC9.apk?fsname=com.snda.wifilocating_4.2.91_3211.apk&csr=1bbd';

方法三:借助HTML5 Blob实现文本信息文件下载

methods: {

//获取blob流文件 以axios为例

getData(){

axios({

method: 'post',

url: 'api/user/',

data: {

firstName: 'Fred',

lastName: 'Flintstone'

},

responseType: 'blob'

}).then(response => {

this.download(response) //调用dewnload函数

}).catch((error) => {

})

}

// 下载文件

download (data) {

if (!data) {

return

}

let blob = new Blob([data]) //创建blob方法

let fileName = 'excel.xls' //下载名称

if ('download' in document.createElement('a')) { // 不是IE浏览器

// 简单的理解一下就是将一个file或Blob类型的对象转为UTF-16的字符串,并保存在当前操作的document

let url = window.URL.createObjectURL(blob)

let link = document.createElement('a') //创建a标签

link.style.display = 'none' //隐藏a标签

link.href = url //指定下载url

link.setAttribute('download', fileName) //指定下载文件名称

document.body.appendChild(link)

link.click() //触发下载事件

document.body.removeChild(link) // 下载完成移除元素

window.URL.revokeObjectURL(url) // 释放掉blob对象

} else { // IE 10+

window.navigator.msSaveBlob(blob, fileName)

}

}

}

};

推荐文章

三级分销APP制作
365bet亚洲

三级分销APP制作

📅 09-07 👁️‍🗨️ 7034
堆基础02:malloc源码分析
365bet网站

堆基础02:malloc源码分析

📅 10-04 👁️‍🗨️ 8601
华为下载管理器在哪里打开
365bet网站

华为下载管理器在哪里打开

📅 07-30 👁️‍🗨️ 2661