前端请求下载（react）

原创于 2020-11-24 14:39:05 发布 · 228 阅读

0 ·

CC 4.0 BY-SA版权

react 专栏收录该内容

21 篇文章

订阅专栏

这段代码演示了如何通过XMLHttpRequest请求一个GET资源，并将响应转换为blob，创建一个隐藏的a标签用于下载名为'cs.xlsx'的文件。请求头设置了'Content-Type'和'xToken'，并处理了跨域问题。

let oReq = new XMLHttpRequest();
oReq.open("GET", getUrl(requestUrlBase, `/******`), true);
oReq.responseType = "blob";
oReq.setRequestHeader("Content-Type", "application/octet-stream", 'cors', "Access-Control-Allow-Origin", "*");
oReq.setRequestHeader("xToken", "854566eb00534affa8cfe16d05bfdbf5");
oReq.onload = function (oEvent) {
  let content = oReq.response;
  console.log('oReq.response', oReq.response)
  let elink = document.createElement('a');
  elink.download = 'cs.xlsx';//xls   因为后台输入是csv'格式，用xls显示的不理想      
  elink.style.display = 'none';
  let blob = new Blob([content]);
  elink.href = URL.createObjectURL(blob);
  document.body.appendChild(elink);
  elink.click();
  document.body.removeChild(elink);

};
oReq.send();