js 文件上传和下载

文件上传

FormData 和 FileReader

URL.createObjectURL([接收blob或file]) 创建一个url 下载使用a标签， 预览标签的src

文件下载

a标签

第一种

完整路径下载

第二种

let a = document.createElement('a');
a.href = url;
a.download = filename;
a.click();

第三种

window.open(url)

window.localhost.href =  url

如果后台返回的文件流，请求的 responseType 设置成 arraybuffer 或者 blob，再使用URL.createObjectURL() 生产url实现查看下载

   axios({
            url:"xxxxxx",
            responseType:'blob'
          }).then(res =>{
            let url = URL.createObjectURL(res.data)  //  res.data 的类型要么是file，要么是blob
            let a = document.createElement('a');
            a.href = url;
            a.download = 'xxx.png';
            a.click();
            let img = document.createElement('img');
            img.src = url
          })

在线查看pdf

一.

  document.getElementById('input').onchange = function(e){
            console.log(e.target.files[0])
            let URL = window.URL || window.webkitURL;
            let url = URL.createObjectURL(e.target.files[0]);
            window.open(url)
          }

二