js下载文件

82 阅读1分钟

一、使用a标签

<a href="url" download">下载文件</a>
<a href="url" download="fileName">下载文件</a>

使用:给a标签添加download属性,点击就可以下载url的文件,download的值是自定义下载的文件名

缺点:只能下载同源url,跨源情况下,download属性会被自动忽略

二、通过ajax

可以看到最后其实还是通过a标签的download属性实现下载的

function downloadFile(fileUrl, fileName) {
  const xhr = new XMLHttpRequest();
  xhr.open('GET', fileUrl);
  xhr.responseType = 'blob';
  xhr.addEventListener('load', () => {
    let url = window.URL.createObjectURL(xhr.response);
    let a = document.createElement('a');
    a.href = url;
    a.download = fileName;
    a.click()
  })
  xhr.send();
}