浏览器下载文件

浏览器页面点击【下载】按钮,将对应的文件下载到用户本地

// 1. 安装 file-saver
yarn add file-saver

// 2. 引入 file-saver
import FileSave from 'file-saver'

/** 浏览器下载 文件
  fileUrl:  文件链接地址
  fileName:  自定义文件名
*/
export function downloadFilesInBrowser(fileUrl, fileName = '') {
  const _fileUrl = fileUrl.indexOf('?') !== -1 ? fileUrl.match(/(\S*)\?/)[1] : fileUrl
  const fileType =  _fileUrl.replace(/.+\./, '');
  const _fileName = fileName ? fileName.indexOf(`.${fileType}`) !== -1 ? fileName : `${fileName}.${fileType}` : `${new Date().getTime()}.${fileType}`

  let oReq = new XMLHttpRequest();
  oReq.open('get', fileUrl, true);
  oReq.responseType = 'blob';
  oReq.onload = function () {
    let file = new Blob([oReq.response], {
      type: `application/${fileType}`,
    });
    FileSave.saveAs(file, _fileName);
  };
  oReq.send();
}
©著作权归作者所有,转载或内容合作请联系作者
平台声明:文章内容(如有图片或视频亦包括在内)由作者上传并发布,文章内容仅代表作者本人观点,简书系信息发布平台,仅提供信息存储服务。

推荐阅读更多精彩内容