文件流下载文件

封装一个文件类型文件

// 文件类型
export default {
  aac: 'audio/aac;', // AAC 音频
  abw: 'application/x-abiword;', // AbiWord 文档
  arc: 'application/x-freearc;', // 存档文档(多个文件嵌入)
  avi: 'video/x-msvideo;', // AVI: 音频视频交错
  azw: 'application/vnd.amazon.ebook;', // 亚马逊Kindle电子书格式
  bin: 'application/octet-stream;', // 任何类型的二进制数据
  bmp: 'image/bmp;', // Windows OS/2位图图形
  bz: 'application/x-bzip;', // BZip 存档
  bz2: 'application/x-bzip2;', // BZip2 存档
  csh: 'application/x-csh;', // C-Shell 脚本
  css: 'text/css;', // CSS
  csv: 'text/csv;', // CSV
  doc: 'application/msword;', // Microsoft Word
  docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;', // Microsoft Word (OpenXML)
  eot: 'application/vnd.ms-fontobject;', // MS嵌入式OpenType字体
  epub: 'application/epub+zip;', // 电子出版物(EPUB)
  gif: 'image/gif;', // GIF
  htm: 'text/html;', // 超文本标记语言 (HTML)
  html: 'text/html;', // 超文本标记语言 (HTML)
  ico: 'image/vnd.microsoft.icon;', // Icon 格式
  ics: 'text/calendar;', // iCalendar 格式
  jar: 'application/java-archive;', // Java Archive (JAR)
  jpeg: 'image/jpeg;', // JPEG 图片
  js: 'text/javascript;', // JavaScript
  json: 'application/json;', // JSON 格式
  jsonld: 'application/ld+json;', // JSON-LD 格式
  mid: 'audio/midi audio/x-midi;', // 乐器数字接口(MIDI)
  midi: 'audio/midi audio/x-midi;', // 乐器数字接口(MIDI)
  mjs: 'text/javascript;', // JavaScript 模块
  mp3: 'audio/mpeg;', // MP3 音频
  mpeg: 'video/mpeg;', // MPEG 视频
  mpkg: 'application/vnd.apple.installer+xml;', // 苹果安装程序包
  odp: 'application/vnd.oasis.opendocument.presentation;', // OpenDocument演示文档
  ods: 'application/vnd.oasis.opendocument.spreadsheet;', // OpenDocument 电子表格文件
  odt: 'application/vnd.oasis.opendocument.text;', // OpenDocument 文本文档
  oga: 'audio/ogg;', // OGG 音频
  ogv: 'video/ogg;', // OGG 视频
  ogx: 'application/ogg;', // OGG
  otf: 'font/otf;', // OpenType 字体
  png: 'image/png;', // 便携式网络图形（PNG）
  pdf: 'application/pdf;', // PDF
  ppt: 'application/vnd.ms-powerpoint;', // Microsoft PowerPoint
  pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation;', // Microsoft PowerPoint (OpenXML)
  rar: 'application/x-rar-compressed;', // RAR 存档
  rtf: 'application/rtf;', // 富文本格式 (RTF)
  sh: 'application/x-sh;', // Bourne shell 脚本
  svg: 'image/svg+xml;', // 可缩放矢量图形 (SVG)
  swf: 'application/x-shockwave-flash;', // 小型web格式 (SWF) or Adobe Flash document
  tar: 'application/x-tar;', // Tape 归档(TAR)
  tif: 'image/tiff;', // 标记图像文件格式 (TIFF)
  tiff: 'image/tiff;', // Tagged Image File Format (TIFF)
  ttf: 'font/ttf;', // TrueType 字体
  txt: 'text/plain;', // Text
  vsd: 'application/vnd.visio;', // Microsoft Visio
  wav: 'audio/wav;', // 波形音频格式
  weba: 'audio/webm;', // WEBM 音频
  webm: 'video/webm;', // WEBM 视频
  webp: 'image/webp;', // WEBP 图片
  woff: 'font/woff;', // 网页开放字体格式 (WOFF)
  woff2: 'font/woff2;', // 网页开放字体格式 (WOFF)
  xhtml: 'application/xhtml+xml;', // XHTML
  xls: 'application/vnd.ms-excel;', // Microsoft Excel
  xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet;', // Microsoft Excel (OpenXML)
  xml: 'text/xml;', // XML  application/xml（普通用户不可读）、text/xml（普通用户可读）
  xul: 'application/vnd.mozilla.xul+xml;', // XUL
  zip: 'application/zip;', // ZIP
  '3gp': 'video/3gpp;', // 3GPP audio/video 容器  video/3gpp、audio/3gpp（不含视频）
  '3g2': 'video/3gpp2;', // 3GPP2 audio/video 容器  video/3gpp2、audio/3gpp2（不含视频）
  '7z': 'application/x-7z-compressed;' // 7-zip
}

**
 * 将地址转换为文件流格式
 * @param {*} url  文件路径
 * @returns
 */
function changeBlob(url) {
  return new Promise(resolve => {
    const xhr = new XMLHttpRequest()
    xhr.open('GET', url, true)
    xhr.responseType = 'blob'
    xhr.onload = () => {
      if (xhr.status === 200) {
        resolve(xhr.response)
      }
    }
    xhr.send()
  })
}

 
/**
 * 封装一个公用的文件下载
 * @param {*} data 文件对象
 * @param {*} fileName  文件名称
 */
function fileDownload(data, type, fileName) {
  const blob = new Blob([data], {
    // type类型后端返回来的数据中会有，根据自己实际进行修改
    type: bobtype[type] + 'charset-UTF-8'
  })
  const filename = fileName || type + '文件'
  if (typeof window.navigator.msSaveBlob !== 'undefined') {
    window.navigator.msSaveBlob(blob, filename)
  } else {
    const blobURL = window.URL.createObjectURL(blob)
    // 创建隐藏<a>标签进行下载
    const tempLink = document.createElement('a')
    tempLink.style.display = 'none'
    tempLink.href = blobURL
    tempLink.setAttribute('download', filename)
    if (typeof tempLink.download === 'undefined') {
      tempLink.setAttribute('target', '_blank')
    }
    document.body.appendChild(tempLink)
    tempLink.click()
    document.body.removeChild(tempLink)
    window.URL.revokeObjectURL(blobURL)
  }
}

/**
 * 根据文件路径下载文件 
 * @param {*} url  请求路径
 * @param {*} type 请求类型
 * @param {*} fileName  文件名称
 */
function fileDownloadUrl(url, type, fileName) {
  axios
    .get(url, { responseType: 'blob' })
    .then(res => {
      try {
        const blob = new Blob([res.data], {
          type: bobtype[type]
        })
        const objectUrl = URL.createObjectURL(blob)
        const a = document.createElement('a')
        a.href = objectUrl
        a.download = fileName || type + '.' + type
        a.style.display = 'none'
        document.body.appendChild(a)
        a.click()
        URL.revokeObjectURL(a.href)
        document.body.removeChild(a)
      } catch (e) {
        this.$message.error('下载失败')
      }
    })
    .finally(() => {
      this.downloadLoading = false
    })
}

说明：fileDownloadUrl 是配合vue进行下载的 ，其他两个是changeBlob fileDownload是配合使用的