之前的好多方法都是用A标签直接下载,可是这样会打开新标签页展示图片,而不是下载图片。查资料发现是因为当前网址和图片地址不同源导致的。 改用fetch获取blob再下载就能直接下载图片了
/**
* 根据资源url下载文件
* @param url
* @param fileName
*/
export async function download (url: string, fileName = ''): Promise<void> {
try {
const response = await fetch(url)
const blob = await response.blob()
const aLink = document.createElement('a')
aLink.style.display = 'none'
aLink.download = fileName
aLink.href = URL.createObjectURL(blob)
document.body.appendChild(aLink)
aLink.click()
document.body.removeChild(aLink)
URL.revokeObjectURL(aLink.href)
} catch (error) {
console.error(error)
}
}