前端GET请求下载后端返回数据流文件，并且处理window.open方法跳转白屏方法

 平时常用导出都是用window.open方法     点击跳转连接：使用 window.open 下载

const downError = `地址?&参数=${参数|| ''}`;
const downError = `Url+/xxx/xxx?&orgId=${orgId || ''}`;
 
window.open(downError, "_self");//调用window.open方法导出

而使用window.open时有时候会出现接口异常、或者部分浏览器可能兼容性问题导致会跳转连接白屏的问题

现在用后端接口返回的数据流然后导出(切记添加responseType: 'blob',)

首先配置一下request

export const exportPersonnel = (params) => request({
  url: BaseUrl + '/xxx/xxxx',
  headers: {
    "Project-Id": params.projectId,
  },
  method: 'get',
  responseType: 'blob',		//非常关键！文件流方法
  params,
})

请求：

const params = {
    test: '参数1',
    test2: '参数2',
}

this.props.dispatch({
  type: 'TimelySummary/exportArchiveInfo',
  payload: params,
}).then((ret: any) => {
  if (ret) {
    let blob = new Blob([ret],);
    let objectUrl = (window.URL || window.webkitURL).createObjectURL(blob);
    let downFile = document.createElement("a");
    let fileName = "孜然卷测试报表.xlsx";   //报表名
    downFile.style.display = "none";
    downFile.href = objectUrl;
    downFile.download = fileName;          // 下载后文件名
    document.body.appendChild(downFile);
    downFile.click();
    document.body.removeChild(downFile);   // 下载完成移除元素
    window.URL.revokeObjectURL(objectUrl); // 只要映射存在，Blob就不能进行垃圾回收，因此一旦不再需要引用，就必须小心撤销URL，释放掉blob对象。
  }
})

另外post请求可查看文章  点击跳转连接：POST请求导出后端返回数据流