js 通过window.open(url)下载文件，修改文件名

原创已于 2022-12-22 18:48:28 修改 · 9.5k 阅读

20 ·

CC 4.0 BY-SA版权

文章标签：

#javascript #前端 #开发语言

于 2022-12-22 18:44:26 首次发布

vue 同时被 2 个专栏收录

20 篇文章

订阅专栏

3 篇文章

订阅专栏

本文介绍了一种前端通过window.open(url)下载文件时如何自定义文件名的方法。提供了一个名为downFile的公共函数，该函数利用XMLHttpRequest获取文件Blob，然后创建a标签触发下载，从而实现下载文件名的定制。在实际应用中，只需传入文件URL和自定义文件名即可调用此功能。

通过window.open(url)下载文件（xlsx、xls、zip等格式文件），如果前端想要自定义更改下载时的文件名，可以使用以下方法

写一个公共方法

// 下载文件，自定义文件名称
export function downFile(url, fileName) {
  const x = new XMLHttpRequest()
  x.open('GET', url, true)
  x.responseType = 'blob'
  x.onload = function() {
    const url = window.URL.createObjectURL(x.response)
    const a = document.createElement('a')
    a.href = url
    a.download = fileName
    a.click()
  }
  x.send()
}