封装下载文件(后台返回二进制流)

72 阅读1分钟

第一步:新建文件

新建文件.webp

文件内代码

export default {
    // 下载 Excel 方法
    excel(data, fileName) {
        this.download0(data, fileName, 'application/vnd.ms-excel')
    },
    // 下载 Word 方法
    word(data, fileName) {
        this.download0(data, fileName, 'application/msword') 
    },
    // 下载 Zip 方法
    zip(data, fileName) {
        this.download0(data, fileName, 'application/zip')
    },
    // 下载 Html 方法
    html(data, fileName) {
        this.download0(data, fileName, 'text/html')
    },
    // 下载 Markdown 方法
    markdown(data, fileName) {
        this.download0(data, fileName, 'text/markdown')
    },
    // 下载pdf方法
    pdf(data, fileName) {
        this.download0(data, fileName, 'application/pdf')
    },
    
    download0(data, fileName, mineType) {
        // 创建 blob
        let blob = new Blob([data], { type: mineType })
        // 创建 href 超链接,点击进行下载
        window.URL = window.URL || window.webkitURL
        let href = URL.createObjectURL(blob)
        let downA = document.createElement('a')
        downA.href = href
        downA.download = fileName
        downA.click()
        // 销毁超连接
        window.URL.revokeObjectURL(href)
    }
 }

第二步:在main.js全局引入,注册为全局

import plugins from './plugins'

第三步:定义接口

export function getAdmissionMaterialsDownload(query) { 
    return request({ 
        url: '/bpm/employ/admission/admissionMaterialsDownload', 
        method: 'get',
        responseType: 'blob', 
        params: query,
      }) 
 }

第四步:使用封装的函数

let result = await getAdmissionMaterialsDownload({ id: item.id })
this.$download.zip(result, item.name + '入场资料.zip`')