开发过程中移动端实现文件下载

First step: 建js文件，添加如下代码

/**
 * 通过文件类型来返回blob数据类型
 * @param {*} fileType
 * @returns
 */
function getFileTypeMime (fileType) {
  switch (fileType) {
    // 若无对应fileType，会导致在移动端无法下载/打开该文件或者空白
    // 若不加，则移动端无法打开
    // https://developer.mozilla.org/zh-CN/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Common_types.
    case 'png':
      return 'image/png'
    case 'doc':
      return 'application/msword'
    case 'docx':
      return 'application/vnd.openxmlformats-officedocument.wordprocessingml.document;charset=utf-8'
    case 'jpg':
    case 'jpeg':
      return 'image/jpeg'
    case 'gif':
      return 'image/gif'
    case 'svg':
      return 'image/svg+xml'
    case 'tif':
    case 'tiff':
      return 'image/tiff'
    case 'txt':
      return 'text/plain'
    case 'ppt':
      return 'application/vnd.ms-powerpoint'
    case 'pptx':
      return 'application/vnd.openxmlformats-officedocument.presentationml.presentation'
    case 'xls':
      return 'application/vnd.ms-excel'
    case 'xlsx':
      return 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet'
    case 'zip':
      return 'application/zip'
    case '7z':
      return 'application/x-7z-compressed'
    case 'pdf':
      return 'application/pdf'
    case 'mp3':
      return 'audio/mpeg'
  }
}
/**
 * 下载文件
 */
export default async (blobData, fileName = '', fileType = '') => {
  const fileTypeMime = getFileTypeMime(fileType)
  if (!blobData) return
  let blob = new Blob([blobData], {
    type: fileTypeMime
  })
  const blobUrl = window.URL.createObjectURL(blob)
  const a = document.createElement('a')
  a.download = fileName
  a.href = blobUrl
  a.target = '_blank'
  a.click()
  window.URL.revokeObjectURL(blobUrl)
}

Second step: 然后需要在请求头添加：

responseType: 'blob',

Third step: 最后在接口请求文件调用js文件，处理结果时调用downloadFile()即可

import downloadFile from '**/downloadFile'

const type = 'docx' // 文件格式
downloadFile(res.data,`${name}.${type}`,type) // name：下载之后想要的文件名

微信端需要判断机型的话可使用如下代码：

 // 判断机型
getUA (userAgent) {
  if (userAgent && typeof userAgent === 'string') {
    return userAgent
  }
  return navigator.userAgent
},
if (this.getUA().match(/Android/i)){
	// Android
} else {
	// ios
}