前端下载方式

  • h5 a标签新增属性download
     <a href="/a.txt" download="a.txt">同步下载文件</a>
    
  • nginx 处理
    add_header Content-Disposition 'attachment; filename="nginx.txt"';
    
  • blob ``` var debug = {hello: “world”}; var blob = new Blob([JSON.stringify(debug, null, 2)], {type : ‘text/plain’}); var url = URL.createObjectURL(blob); document.getElementById(‘a’).href=url

    let reader = new FileReader(); reader.addEventListener(“loadend”, function() { console.log(reader.result); });

- 异步下载文

后端接口是post时,a标签下载就不能用了 function getfile(){ var xhr = new XMLHttpRequest(); xhr.open(“post”, ‘/url’, true); //xhr.setRequestHeader(‘Content-Type’,’application/json; charset=utf-8’) xhr.responseType = “blob”; xhr.onload = function() { if (this.status == 200) { reader.readAsDataURL(this.response) let url = URL.createObjectURL(this.response); let a= document.createElement(‘a’) a.href=url a.download=”stream.txt” a.click() } }; xhr.send(); } ```