[html] 使用a标签的download属性下载文件会有跨域问题吗？如何解决？

最近刚遇到这个问题，后台返回的图片链接，点击按钮批量下载，a标签的 download 属性只对同源文件有效，
所以我们这里先把图片 url 转为 blob 格式，然后再下载/**** 将图片 url 转换为 blob 格式** @param httpUrl: 图片链接，如 https://cdn.aaa.com/bbb.jpg*/private async urlToBlob(httpUrl) {const res: Response = await fetch(httpUrl);const blob: Blob = await res.blob();const blobUrl = URL.createObjectURL(blob);return blobUrl;}/**** 下载图片到本地** @param blobUrl： blob 格式的图片文件** @param name: 图片名称*/private download(blobUrl, name) {// 创建虚拟a标签const eleLink = document.createElement('a');eleLink.download = name;eleLink.style.display = 'none';eleLink.href = blobUrl;// 触发点击document.body.appendChild(eleLink);eleLink.click();// 然后移除document.body.removeChild(eleLink);URL.revokeObjectURL(blobUrl);}

个人简介

我是歌谣，欢迎和大家一起交流前后端知识。放弃很容易，
但坚持一定很酷。欢迎大家一起讨论

主目录

与歌谣一起通关前端面试题