js 下载文件

忘羡
  • 118

后台传文件流给我,我要怎么下载 post获取的文件流是不是不能通过window.location.href下载?如果能下载该怎么处理,这种情况下前端location.href好像不能下载。如果是get的话是不是location.href就能下载?

回复
阅读 30.9k
3 个回答
✓ 已被采纳

后来解决了,但是不知道为什么文件名是797bb297-60ea-4069-911b-04133ce2b313这种类型
后台的人是设置了Content-Disposition,前端是是使用了vue和vueResource,vueResource在请求的时候需要加一句Vue.http.options.responseType = 'arraybuffer',然后再对返回的数据流做如下处理

downloadFile(content) {
      let blob = new Blob([content], { type: 'application/vnd.ms-excel' }) //根据实际情况设置type
      let objUrl = URL.createObjectURL(blob)
      window.location.href = objUrl
    }

我们项目中使用的。

export const downloadFile = (fileName, url) => {
  if (isIE()) {
    ieDown(url)
  } else {
    const aLink = document.createElement('a');
    const evt = document.createEvent('MouseEvents');
    // var evt = document.createEvent("HTMLEvents")
    evt.initMouseEvent('click', true, false, window, 0, 0, 0, 0, 0, false, false, false, false, 0, null);
    aLink.download = fileName;
    aLink.href = url;
    aLink.dispatchEvent(evt)
  }
};

const ieDown = url => {
  window.open(url)
};

const isIE = () => {
  const explorer = window.navigator.userAgent;
  return explorer.indexOf('MSIE') >= 0 || explorer.indexOf('Trident/7.0') >= 0 || explorer.indexOf('Edge') >= 0;
};
j_bleach
  • 2.5k

两种方法(第二种貌似是后端加)
1.<a href="你的下载地址" download> 核心是download属性。
2.下载地址加header("Content-Disposition:attachment;filename=xxx"); 核心是header。

撰写回答
你尚未登录,登录后可以
  • 和开发者交流问题的细节
  • 关注并接收问题和回答的更新提醒
  • 参与内容的编辑和改进,让解决方法与时俱进
宣传栏