前端使用a标签下载文件并修改文件名

最新推荐文章于 2024-08-07 09:18:01 发布

xym100111100

最新推荐文章于 2024-08-07 09:18:01 发布

阅读量3.4k

点赞数

分类专栏：前端文章标签：前端 javascript html5

本文链接：https://blog.csdn.net/xym100111100/article/details/122541384

版权

前端专栏收录该内容

15 篇文章 0 订阅

订阅专栏

原本使用url是可以直接用window.href = url 来下载，但是这样的话会因为同源问题而download属性设置不生效导致文件		 名还是下载的时候的url后缀文件名，使用这种方式的话文件名就生效

const xhr = new XMLHttpRequest();
xhr.open(‘GET’, ‘url’, true);
xhr.responseType = ‘blob’;
xhr.onload = function() {
if (this.status === 200) {
const blob = new Blob([this.response]);
const blobUrl = window.URL.createObjectURL(blob);
const a = document.createElement(‘a’);
a.href = blobUrl;
a.download = fileName;
a.click();
window.URL.revokeObjectURL(blobUrl);
}
};
xhr.send();