js生成及下载浏览器端的文件-Eric

使用js生成及下载浏览器端的文件-Eric

---

前言

以前写了一篇文章一次下载多个文件的解决方案中写了如何下载服务器端的文件（支持连续下载多个），今天和你们分享下如何在浏览器端生成文件并下载。

---

场景

若是线上常常出现一些偶发性问题，本地又很差排查，咱们只好添加一些追踪日志，当出现问题的时候咱们能根据日志进行排查。

---

解决方案

首先咱们先明确一点，IE浏览器不支持直接下载文件（禁用了反向和正向缓存），咱们须要使用另存为功能，google浏览器咱们能够直接下载。若是是为了记录日志，咱们通常选择txt文件或者html文件（能够加样式，排版）。

---

代码

const downloadErrorLog = (fileName, content) => {
    // IE
    if(!!window.ActiveXObject || "ActiveXObject" in window) {
        var winname = window.open('', '_blank');
        winname.document.open('text/html', 'replace');
        winname.document.writeln(content);// 若是是jsx代码，记得转化为html
        winname.document.execCommand('saveas','', fileName);
        winname.close();
    }else{
        let aLink = document.createElement('a');
        aLink.download = fileName;
        aLink.href = "data:text/plain," + content; // 切记，content只能是字符串，若是是html元素，记得使用.innerHTML转换
        aLink.click(); 
    }
}