zoukankan      html  css  js  c++  java
  • 流文件下载方法

    重要知识点:

    FileReader.readAsText()

    readAsText 方法可以将 Blob 或者 File 对象转根据特殊的编码格式转化为内容(字符串形式)

     
    const download = (res, mime) => {
        const mimeList = {
          pdf: 'application/pdf',
          jpg: 'image/jpeg',
          jpeg: 'image/jpeg',
          gif: 'image/gif',
          png: 'image/png',
          doc: 'application/msword',
          docx: 'application/vnd.openxmlformats-officedocument.wordprocessingml.document',
          ppt: 'application/vnd.ms-powerpoint',
          pptx: 'application/vnd.openxmlformats-officedocument.presentationml.presentation',
          xls: 'application/vnd.ms-excel',
          xlsx: 'application/vnd.openxmlformats-officedocument.spreadsheetml.sheet',
          zip: 'application/zip',
          rar: 'application/x-rar-compressed',
          bmp: 'image/bmp',
          tif: 'image/tiff',
        }
        if (res && res.type.indexOf('application/json') > -1) {
          const reader = new FileReader()
          reader.onload = () => {
            if (reader.result) {
              const result = JSON.parse(reader.result)
              Vue.prototype.$message.error(result.desc)
            }
          }
          reader.readAsText(res, 'utf-8')
          return
        }
        const blob = new Blob([res], { type: mimeList[mime] || 'application/vnd.ms-excel' })
        if (window.navigator && window.navigator.msSaveOrOpenBlob) {
          window.navigator.msSaveOrOpenBlob(blob, downloadName)
        } else {
          const blobURL = window.URL.createObjectURL(blob)
          const tempLink = document.createElement('a')
          tempLink.style.display = 'none'
          tempLink.href = blobURL
          tempLink.setAttribute('download', downloadName)
          if (typeof tempLink.download === 'undefined') {
            tempLink.setAttribute('target', '_blank')
          }
          document.body.appendChild(tempLink)
          tempLink.click()
          document.body.removeChild(tempLink)
          setTimeout(() => {
            window.URL.revokeObjectURL(blobURL)
          }, 50)
        }
      }
  • 相关阅读:
    (100%成功超详细图文教程)虚拟机VM ware中centos7无法上网及Xshell配置正确但是连接不上本地虚拟机问题汇总
    react-art 初步
    React-父组件访问子组件内部
    React学习随笔
    关于Git使用的常见问题和命令
    ES6随笔--Module
    ES6随笔--Set和Map
    ES6随笔--Promise
    ES6随笔--Symbol
    ES6随笔--各数据类型的扩展(3)--函数
  • 原文地址:https://www.cnblogs.com/xcdl/p/15241232.html
Copyright © 2011-2022 走看看