怎么指定下载文件名？

在浏览器中下载文件是一个比较常见的操作，那么你知道在前端怎么去给要下载的文件指定一个文件名吗？

1. 指定 Content-Disposition 响应头

通过设置响应头中的 Content-Disposition 字段，可以来指定下载文件的文件名。我们需要将 Content-Disposition 设置为 attachment ，并在 filename 参数中指定所需的文件名。

比如我需要将下载文件的文件名设置为 file.txt ，可以这样设置：

res.setHeader('Content-Disposition', 'attachment; filename=file.txt');

2. 通过 a 标签的 download 属性

除了上面需要在后端设置响应头的方式之外，还可以通过在前端给 a 标签添加 download 属性来实现。

例如如下链接，链接指向的是一个图片，当点击下载时，会将图片下载到本地，并且文件名为 baidu.png 。

<a href="https://www.baidu.com/img/bd_logo1.png" download="baidu.png">下载</a>

当然，我们还可以通过使用 Blob 来实现相同的下载功能，其方式和上面使用 a 标签的方式类似。

function downloadFile(url, filename) {
  fetch(url)
    .then((response) => response.blob())
    .then((blob) => {
      const link = document.createElement('a');
      link.href = URL.createObjectURL(blob);
      link.download = filename;
      document.body.appendChild(link);
      link.click();
      document.body.removeChild(link);