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 = new 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 = new Blob([res]);
                    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);
                    }

                },
                (error)=>{
                    let reader = new 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;