后端返回一个url前端怎么把音视频文件下载下来

后端返回一个url前端怎么把文件下载下来

最近做的项目有一个用腾讯云上传音视频的功能,在后台管理里面需要将音视频下载下来,后端是直接返回腾讯云视频url地址的,

    // 点击下载文件
    downloadFile(file) {
        // 音视频下载
        if (file.url.indexOf('http://') >=0 || file.url.indexOf('https://') >= 0) {
          let handleUrl = ''
          // 本站用的https:// 接口返回的http,这样可能会跨域导致无法下载,这里手动将字符串的http转一下
          if (location.protocol === 'https:') {
            handleUrl = file.url.replace('http://', 'https://')
          } else {
            handleUrl = file.url
          }
          const loading = this.$loading({
            lock: true,
            text: '正在下载中...',
            spinner: 'el-icon-loading',
            background: 'rgba(0, 0, 0, 0.7)'
          })
          var xhr = new XMLHttpRequest()
          xhr.open("GET", handleUrl, true)
          xhr.responseType = 'blob'
          xhr.onload = function(e){
            if (e.target.readyState === 4 && e.target.status === 200) {
                let blob = this.response
                // 转换一个blob链接
                let u = window.URL.createObjectURL(new Blob([blob]))
                let a = document.createElement('a');
                a.download = file.fileName
                a.href = u
                a.style.display = 'none'
                document.body.appendChild(a)
                a.click()
                a.remove()
                loading.close()
            }
          }
          xhr.send()
        }
    },
    原文作者:Blues_jim
    原文地址: https://blog.csdn.net/Blues_jim/article/details/109285111
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞