用blob下载音乐文件

1.前端下载,后端跨域处理

        const filePath = props.line.path
        const name = props.line.name
        fetch(filePath,{method: 'GET',mode: 'no-cors',}).then(res => res.blob()).then(blob => {
          const a = document.createElement('a');
          document.body.appendChild(a)
          a.style.display = 'none'
          // 使用获取到的blob对象创建的url
          const url = window.URL.createObjectURL(blob);
          a.href = url;
          // 指定下载的文件名
          a.download = name + '.mp3';
          a.click();
          document.body.removeChild(a)
          // 移除blob对象的url
          window.URL.revokeObjectURL(url);  
})  

2.后端返回数据流,前端点击get请求下载

        const path = props.line.path || ''
        const musicName = props.line.musicName || ''
        this.$http.get(apis.audio_upload_download + `?path=${path}&musicName=${musicName}`).then(response => {
          let data = response.body
          var elink = document.createElement('a');
          elink.download = musicName + ".mp3";
          elink.style.display = 'none';
          var blob = new Blob();
          
          elink.href = URL.createObjectURL(blob);
          document.body.appendChild(elink);
          elink.click();
          document.body.removeChild(elink);
        });

猜你喜欢

转载自www.cnblogs.com/zhuangcui/p/12526368.html