普通url的下载
应用场景:
当下载文件中存在浏览器可以直接预览的文件,使用a标签即使加了download仍然会在浏览器中打开下载文件。
示例:
https://wework.qpic.cn/wwpic/306595_0iIcXxBHTkKvsxV_1610689000/0
https://allpro.saas.top/1610704815878.jpg
解决方案:
我们可以将下载地址借助Blob转换成二进制,然后,作为a标签的href属性,配合download属性,实现下载
代码:
const link = document.createElement('a');
const url = imageUrl; // 要下载的路径
// 这里是将url转成blob地址,
fetch(url).then(res => res.blob()).then(blob => {
// Blob {size: 746, type: "text/html"}
link.href = URL.createObjectURL(blob);
console.log(link.href);
link.download = 'picName';
document.body.appendChild(link);
link.click();
})