【问题标题】：Change downloaded file name更改下载的文件名
【发布时间】：2017-09-19 14:02:03
【问题描述】：

我有一个通过 URL 上传图片的功能。我想更改文件名，下载文件：'image.jpg'。

这就是我所做的：

public downloadImageJpeg(instanceUID: string, format: string): string {
  var a = document.createElement("a");
  a.download = 'image.jpg';
  a.href = this.getRootUrl() + `/dicom/instances/${instanceUID}/wado/jpg`;

  var e = document.createEvent("MouseEvents");
  e.initMouseEvent("click", true, false, document.defaultView, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
  a.dispatchEvent(e);
}

我的图片已上传，但它的名称没有改变，它是“jpg.jpg”。你知道为什么不是'image.jpg'吗？？

////////////编辑////////////:

但是，我认为我的错误来自a.href。在一些例子中，我看到他被赋予了参数。我试过这个：

a.href =  "data:image/jpg;base64," + this.getRootUrl() + `/dicom/instances/${instanceUID}/wado/jpg`;

文件名更改得很好，但我没有下载，这让我'网络故障-错误'

【问题讨论】：

我在纯js中试过了，它对我有用...你的意思是什么名字没有改变，当你点击链接（或触发事件）时默认建议的名字是jpg.jpg`？你用的是什么浏览器？
@m.nachury 是的，当我单击调用我的函数“downloadImageJpeg”的按钮时，它会自动下载一个名为“jpg.jpg”而不是“image.jpg”的文件。我使用谷歌浏览器。
你可以在不同的浏览器下试试这个吗，chrome如果他认为数据源是cross-origin可能是由角度引起的，有时会忽略下载属性。换个浏览器试试看是不是这样。
还要检查您的开发选项卡：单击按钮时浏览器发出的请求。查看响应 http 标头中是否有 content-Disposition 或响应或请求中的任何其他内容标头。我认为这会覆盖下载属性
@m.nachury 当我使用 Firefox 时，它不会向我下载任何东西......不，在 Chrome 浏览器下没有内容处理

标签： javascript image angular typescript url

【解决方案1】：

以下功能可以正常工作：

export function download(url: string, filename: string) {
  var a = document.createElement('a');
  if (a.click) {
    // Use a.click() if available. Otherwise, Chrome might show
    // "Unsafe JavaScript attempt to initiate a navigation change
    //  for frame with URL" and not open the PDF at all.
    // Supported by (not mentioned = untested):
    // - Firefox 6 - 19 (4- does not support a.click, 5 ignores a.click)
    // - Chrome 19 - 26 (18- does not support a.click)
    // - Opera 9 - 12.15
    // - Internet Explorer 6 - 10
    // - Safari 6 (5.1- does not support a.click)
    a.href = url;
    a.target = '_parent';
    // Use a.download if available. This increases the likelihood that
    // the file is downloaded instead of opened by another PDF plugin.
    if ('download' in a) {
      a.download = filename;
    }
    // <a> must be in the document for IE and recent Firefox versions.
    // (otherwise .click() is ignored)
    (document.body || document.documentElement).appendChild(a);
    a.click();
    a.parentNode!.removeChild(a);
  } else {
    if (window.top === window &&
      url.split('#')[0] === window.location.href.split('#')[0]) {
      // If _parent == self, then opening an identical URL with different
      // location hash will only cause a navigation, not a download.
      var padCharacter = url.indexOf('?') === -1 ? '?' : '&';
      url = url.replace(/#|$/, padCharacter + '$&');
    }
    window.open(url, '_parent');
  }
}

来源

来自 PDF 查看器：https://github.com/mozilla/pdf.js/blob/94089960c04d7f59eb637d6dc63944115bbc539d/web/download_manager.js#L29-L63

【讨论】：

我不明白..它也不起作用..我总是下载一个文件：'jpg.jpg'