前端文件下载方案

[fangmd]

通过 a 标签

<a href="http://www.baidu.com" download="baidu.html">下载</a>

只能下载同源的文件，跨域的文件都是预览。

const a = document.createElement('a')
a.href = 'http://www.baidu.com'
a.download = 'baidu.html'
a.click()

[fangmd]

window.open

window.open('http://www.baidu.com', '_blank')

window.open('http://www.baidu.com', '_blank', 'download=baidu.html')

不能下载跨域文件

[fangmd]

blob

// 下载文件
export function downloadFile(obj, name, suffix) {
  const url = window.URL.createObjectURL(new Blob([obj]))
  const link = document.createElement('a')
  link.style.display = 'none'
  link.href = url
  const fileName = parseTime(new Date()) + '-' + name + '.' + suffix
  link.setAttribute('download', fileName)
  document.body.appendChild(link)
  link.click()
  document.body.removeChild(link)
}

• const url = URL.createObjectURL(blob): 把 blob 对象转化成一个 url, 这个 url 可以用来下载文件，也可以用来预览文件。