关于js文件下载重命名的问题
先说一下出现问题的情况,首先是文件上传的时候后端会给文件添加一个时间戳,另外由于文件服务器的地址不同,导致跨域的问题,使得a标签的download="filename"不生效
参考https://www.jianshu.com/p/6545015017c4
解决方案:
1不跨域的情况
<a href="url" download="filename" />
但是注意download属性的兼容性,可以参考w3c文档内容
解决方案:
2:跨域情况下
1 /* 2 * 获取blob 3 * @params {String} url文件地址 4 * @{params} {String} filename重命名名称 5 * @return {Promise} 6 */ 7 download (url, filename) { 8 this.getBlob(url).then(blob => { 9 this.saveAs(blob, filename) 10 }) 11 }, 12 getBlob (url) { 13 return new Promise(resolve => { 14 const xhr = new XMLHttpRequest() 15 xhr.open('GET', url, true) 16 xhr.responseType = 'blob' 17 xhr.onload = () => { 18 if (xhr.status === 200) { 19 resolve(xhr.response) 20 } 21 } 22 xhr.send() 23 }) 24 }, 25 saveAs (blob, name) { 26 const link = document.createElement('a') 27 link.href = window.URL.createObjectURL(blob) 28 link.download = name 29 link.click() 30 },