前端文件下载

a标签download属性实现下载

缺点：只能下载同一个ip，端口下的文件，不能跨域（不论被下载文件的后端允不允许跨域，都不行）

<a download href="#"></a>

后端实现，nodeJs的expressJs框架为例

访问该地址就会打开系统文件夹，提示下载，不会显示要下载的内容

//后端
const path = require('path')
app.get('/', (req, res, next) => {
  res.download(path.join(__dirname, './a.jpg'))
})
前端
<a href="localhost:3000/">点我下载</a>

Blob实现下载

可以跨域（前提是允许跨域，若被下载文件的后端做了特殊处理，或不许跨域，这种方法仍然不能下载）

function (url) {
  const xhr = new XMLHttpRequest()
  xhr.open('GET', url)
  //将文件以二进制对象（blob）形式返回
  xhr.responseType = 'blob'
  xhr.send()
  xhr.onload = function() {
    //文件的二进制对象
    const blobFile = xhr.response

    //通过URL.createObjectURL()就可以把文件转换成本域名（同ip，端口）下的路径
    let blobUrl = URL.createObjectURL(blobFile)
    console.log(blobUrl);

    //现在在同ip，端口下了，不跨域，就可以用原始的a标签的download了
    let eleA = document.createElement('a')
    eleA.setAttribute('href', blobUrl)
    eleA.setAttribute('download', '')
    //这就生成一个标签，可以append到html中供点击下载。也可以直接帮人点击
    //eleA.click()
  }
}