如何使用下载属性下载具有特定名称的文件

Question

我正在尝试下载文件，该文件由maner中的服务器生成，如下所示：

public downloadZip(): void{
const link = document.createElement('a');
link.setAttribute(
'href',
`/srv/genZip?id=${this.id}`
);
link.setAttribute('download', '123.zip');
link.click();
}

但它不起作用。。。有人知道我哪里错了吗？

Answer 1

你不能完全驱动这个过程，你只能向浏览器提供提示。

浏览器有几个不同的地方，可以查找下载的文件名：

• 服务器的Content-Disposition标头，它可以包括文件名，例如
  Content-Disposition: attachment; filename="123.zip"
  或
  Content-Disposition: attachment; filename*="123.zip"

• download属性

据我所知，没有规范说明哪一个应该有偏好，所以为了最大限度地提高代码工作的浏览器，我会在两者中指定相同的名称。

强调这一点的是，MDN对上述Content-Disposition的报道中有一条注释：

注意：Chrome和Firefox 82及更高版本，将HTML<a>元素的download属性优先于Content-Disposition: inline参数(对于同源URL(。早期的Firefox版本会对标题进行优先级排序，并以内联方式显示内容。

因此，如果您的服务器返回Content-Disposition: inline，并且您看到资源以内联方式加载(而不是下载(，则您可能正在使用Firefox的旧副本或执行相同操作的浏览器。