获取后端文件地址,下载前自定义名称

后端返回一个文件下载地址,普通方法下载时无法更改文件名称

 // 获取下载文件的 blog 
 getBlob(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()
      })
    }

 // 自定义下载文件名称
 saveAs(blob, filename) {
      if (window.navigator.msSaveOrOpenBlob) {
        navigator.msSaveBlob(blob, filename)
      } else {
        const link = document.createElement('a')
        const body = document.querySelector('body')

        link.href = window.URL.createObjectURL(blob) // 创建对象url
        link.download = filename

        // fix Firefox
        link.style.display = 'none'
        body.appendChild(link)

        link.click()
        body.removeChild(link)

        window.URL.revokeObjectURL(link.href) // 通过调用 URL.createObjectURL() 创建的 URL 对象
      }
    },
    // 使用
    downs(url, name) {
        getBlob(url).then((blob) => {
        saveAs(blob, name)
      })
    }

参考链接

posted @ 2021-10-08 14:19  boyyang  阅读(385)  评论(0编辑  收藏  举报
//黑猫咪:https://unpkg.com/live2d-widget-model-hijiki@1.0.5/assets/hijiki.model.json //白猫咪:https://unpkg.com/live2d-widget-model-tororo@1.0.5/assets/tororo.model.json //萌娘:https://unpkg.com/live2d-widget-model-shizuku@1.0.5/assets/shizuku.model.json //狗狗:https://unpkg.com/live2d-widget-model-wanko@1.0.5/assets/wanko.model.json //萌妹1号:https://unpkg.com/live2d-widget-model-z16@1.0.5/assets/z16.model.json //萌妹2号:https://unpkg.com/live2d-widget-model-koharu@1.0.5/assets/koharu.model.json //萌妹3号:https://unpkg.com/live2d-widget-model-hibiki@1.0.5/assets/hibiki.model.json //妹子4号:https://unpkg.com/live2d-widget-model-izumi@1.0.5/assets/izumi.model.json //妹子5号:https://unpkg.com/live2d-widget-model-miku@1.0.5/assets/miku.model.json //6号:https://unpkg.com/live2d-widget-model-nico@1.0.5/assets/nico.model.json //7号:https://unpkg.com/live2d-widget-model-ni-j@1.0.5/assets/ni-j.model.json //8号:https://unpkg.com/live2d-widget-model-nipsilon@1.0.5/assets/nipsilon.model.json //9号:https://unpkg.com/live2d-widget-model-nito@1.0.5/assets/nito.model.json //10号:https://unpkg.com/live2d-widget-model-tsumiki@1.0.5/assets/tsumiki.model.json //11号:https://unpkg.com/live2d-widget-model-unitychan@1.0.5/assets/unitychan.model.json //帅哥1号:https://unpkg.com/live2d-widget-model-chitose@1.0.5/assets/chitose.model.json //帅哥2号:https://unpkg.com/live2d-widget-model-haruto@1.0.5/assets/haruto.model.json