如何在不使用下载属性的情况下在 IE 和 safari 中下载 csv 文件？ [复制]答案

【问题标题】：How to download a csv file in IE and safari with out using download attribute? [duplicate]如何在不使用下载属性的情况下在 IE 和 safari 中下载 csv 文件？ [复制]
【发布时间】：2017-03-30 05:24:19
【问题描述】：

我有一个 csv 文件链接“http://spatialkeydocs.s3.amazonaws.com/FL_insurance_sample.csv.zip”。我的应用程序是 angularjs 应用程序，为了下载它，我使用了“下载”属性，它在 chrome 和 firefox 中运行良好。但这在 IE 和 Safari 中不起作用，因为 IE 和 Safari 浏览器不支持下载属性。你们能否建议我如何使其适用于 IE 和 safari。如果可能的话，可以分享一个 plunker 吗？提前致谢！

【问题讨论】：

拜托！通过 stackoverflow 链接 - stackoverflow.com/questions/18394871/…
拜托！删除此问题并在堆栈溢出中提出问题之前进行一些研究。
@UtkarshDubey 不要删除这个问题。它被标记为重复，我们继续。不要阻止用户提问，即使它不小心重复了。

标签： javascript html angularjs

【解决方案1】：

这是我在上一个项目中使用的代码。它并不完美，但它通过了所有浏览器和 IE9+ 的 QA。

downloadCSV(data,fileName){
  var blob = new Blob([data], {type:  "text/plain;charset=utf-8;"});
  var anchor = angular.element('<a/>');

  if (window.navigator.msSaveBlob) { // IE
    window.navigator.msSaveOrOpenBlob(blob, fileName)
  } else if (navigator.userAgent.search("Firefox") !== -1) { // Firefox
    anchor.css({display: 'none'});
    angular.element(document.body).append(anchor);

    anchor.attr({
      href: 'data:attachment/csv;charset=utf-8,' + encodeURIComponent(data),
      target: '_blank',
      download: fileName
    })[0].click();

    anchor.remove();
  } else { // Chrome
    anchor.attr({
      href: URL.createObjectURL(blob),
      target: '_blank',
      download: fileName
    })[0].click();
  }
}

在 IE 中使用 ms 特定的 API 最适合我们。另请注意，某些浏览器要求锚点实际上位于 DOM 中才能使下载属性起作用，而 Chrome 则不需要。此外，我们发现 Blob 在各种浏览器中的工作方式存在一些不一致之处。一些浏览器也有导出限制。这允许在每个浏览器 afaik 中最大可能的 CSV 导出。

【讨论】：