文件的下载:
1. 最简单的就是用地址下载
window.open(url)
url就是文件所在的地址
比如:http://....../system_files/teacher.xlsx
这样下载会打开一个网页,为了不打开新网页,可以这样做:
function(fileUrl){
const url = fileUrl
const form = document.createElement('form') // 创建一个form标签
form.method = 'get'
form.action = url
document.body.appendChild(form)
form.submit()
}
2.带token的下载
我们需要用xhr给后端发送一个带token的请求头
downloadFile(filename, fileUrl, token) {
const xhr = new XMLHttpRequest()
const url = fileUrl
xhr.open('get', url, true)
xhr.setRequestHeader('Authorization', `Bearer ${token}`) // 给后端发送请求头
xhr.responseType = 'blob'
xhr.onload = function(e) {
if (this.status === 200) {
const blob = this.response
// URL对象是硬盘(SD卡等)指向文件的一个路径,
//如果我们做文件上传的时候,想在没有上传服务器端的情况下看到上传图片的效果图
//就可是以通过var url=window.URL.createObjectURL(obj.files[0]);获得一个http格式的url路径
//这个时候就可以设置到<img>中显示了
//window.webkitURL和window.URL是一样的,window.URL标准定义
//window.webkitURL是webkit内核的实现(一般手机上就是使用这个),还有火狐等浏览器的实现。
const urlObject = window.URL || window.webkitURL || window
const export_blob = new Blob([blob])
const a = document.createElementNS('http://www.w3.org/1999/xhtml', 'a') // 利用a标签特性下载
const url = urlObject.createObjectURL(export_blob)
a.href = url
a.download = filename
a.click()
}
}
// 发送请求
xhr.send()
}