前端文件下载

文件下载

URL.createObjectURL()

URL.createObjectURL() 静态方法会创建一个 DOMString，其中包含一个表示参数中给出的对象的URL。这个 URL 的生命周期和创建它的窗口中的 document 绑定。这个新的URL 对象表示指定的 File 对象或 Blob 对象，通过URL.createObjectURL()可以获取当前文件的一个内存URL

blob

BLOB (binary large object)----二进制大对象，是一个可以存储二进制文件的容器。
https://developer.mozilla.org/zh-CN/docs/Web/API/Blob

1. a标签下载

 <a href="文件链接" download='下载文件名'></a>

2. axios

 axios({
                    methods: "GET",
                    url: url,
                    responseType: "blob"//设置为blod流
                })
                    .then(res => {
                    // URL.createObjectURL(file)可以得到当前文件的一个内存URL。
                        const href = window.URL.createObjectURL(res.data); //二进制对象创造新的链接
                        const a = document.createElement('a');
                        a.setAttribute('href', href);
                        // filename为文件名字videoFormat为下载文件的格式
                        a.setAttribute('download', filename+'.'+videoFormat);
                        a.click();
                        //在每次调用createObjectURL() 方法时，都会创建一个新的 URL 对象，当不再需要这些 URL 对象时，每个对象必须通过调用 URL.revokeObjectURL() 方法来释放。
                        window.URL.revokeObjectURL(href)
                    })
                    .catch(() => {
                        console.log("视频下载失败");
                    });