js 实现文件下载/文件导出。

1. POST方式进行文件导出;

  // url 下载URL
   fileName 下载文件名称
  function exportFile(url,fileName) {
    let xhr = new XMLHttpRequest();
    xhr.open("POST",url);
    xhr.responseType = "blob";
    xhr.onload = () => {
      let ctx = xhr.response;
      let blob =  Blob([ctx]);
      if ("msSaveOrOpenBlob" in navigator) {兼容IE
        window.navigator.msSaveOrOpenBlob(blob,fileName);
      } else {
        let aLink = document.createElement("a");
        aLink.download = fileName;
        aLink.style.display = "none";
        aLink.href = URL.createObjectURL(blob);
        document.body.appendChild(aLink);
        aLink.click();
        document.body.removeChild(aLink);
      }
    };
    xhr.send();
  }

使用方法:exportFile(url,fileName);

 

使用Angular方式进行导出:

class ExportEvent {
      constructor( private http:HttpClient ){}
         url 下载URL
         fileName 下载文件名称
      exportFile(url,fileName){
            this.http.request("POST",url,{},{responseType:"blob"}).pipe()
       .subscribe( (res)
=>{ let blob = Blob([res]); window.navigator.msSaveOrOpenBlob(blob,fileName); } { let aLink = document.createElement("a"); aLink.download = fileName; aLink.style.display = "none"; aLink.href = URL.createObjectURL(blob); document.body.appendChild(aLink); aLink.click(); document.body.removeChild(aLink); } },(error)=>{ let reader = FileReader(); reader.onload = (e)=>{ if(e && e["target"]){ let errorMsg = JSON.parse(e["target"]["result"]); if(errorMsg && errorMsg["code"]){ console.log("有报错,出错了。。。。。"); } } } error.error的值是一个Blob对象 reader.readAsText(error.error); }
       ); } }

 

2. GET方式进行文件导出;

 url 下载路径
window.location = url;

 

相关文章

AngularJS 是一个JavaScript 框架。它可通过 注:建议把脚本放在 元素的底部。这会提高网页加载速度,因...
angluarjs中页面初始化的时候会出现语法{{}}在页面中问题,也即是页面闪烁问题。出现这个的原因是:由于...
AngularJS 通过被称为指令的新属性来扩展 HTML。AngularJS 指令AngularJS 指令是扩展的 HTML 属性,带有...
AngularJS 使用表达式把数据绑定到 HTML。AngularJS 表达式AngularJS 表达式写在双大括号内:{{ expres...
ng-repeat 指令可以完美的显示表格。在表格中显示数据 {{ x.Name }} {{ x.Country }} 使用 CSS 样式为了...
$http是 AngularJS 中的一个核心服务,用于读取远程服务器的数据。读取 JSON 文件下是存储在web服务器上...