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

前端之家收集整理的这篇文章主要介绍了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相关文章