| js 实现浏览器下载视频2种方法 | 您所在的位置：网站首页 › safari浏览器下载视频下不下来 › js 实现浏览器下载视频2种方法 |
js 实现浏览器下载视频2种方法
|
第一种，这种比较节能，如果视频比较大。不会造成卡顿
fetch('你的视频地址.mp4').then(res => res.blob()).then(blob => {
const a = document.createElement('a');
document.body.appendChild(a)
a.style.display = 'none'
const url = window.URL.createObjectURL(blob);
a.href = url;
a.download = '视频.mp4';
a.click();
document.body.removeChild(a)
window.URL.revokeObjectURL(url);
});
第二中，这种适合url地址中不带参数的地址，和text,wprd,pdf,等文件
不带参数地址比如 http:xxx.xxx.com/down.mp4 带参数地址比如 http:xxx.xxx.com/down.mp4?token=4165465164 带参数的文件流过大会导致页面卡顿 ，【这时后就应该用第一种下载】 downloads(){ var url //下载地址 var xhr = new XMLHttpRequest(); xhr.open('get', url, true); // 也可以使用POST方式，根据接口 // xhr.setRequestHeader("dis_k",`cb9a62d3796e276f8707318b3c48ed3d`); // xhr.setRequestHeader("dis_t",`1617786336`); xhr.responseType = "blob"; // 返回类型blob xhr.onload = function () { if (this.status === 200) { var blob = this.response; var reader = new FileReader(); reader.readAsDataURL(blob); // 转换为base64，可以直接放入a表情href reader.onload = function (e) { var a = document.createElement('a'); a.download ='民间故事-'+weixinvideoplayer.title+'（完整版）'; //下载文件名 a.href = e.target.result; a.click(); window.URL.revokeObjectURL(e.target.result) }; } }; xhr.send(); },前端面试题库 微信搜索 【MST题库】 查看面试题 识图小程序 微信搜索 【花千蒲】 【识图灵】 查看 |
【本文地址】
公司简介
联系我们