如何下载链接为blob类型的视频
关于video标签中的blob链接类型
这里以 央视网视频 为例
网站使用这种格式就是为了增加我们的下载难度。
这种链接是如何生成的
var img = "https://baidu.com/img/PCtm_d9c8750bed0b3c7d089fa7d55720d6cf.png";
fetch(img)
.then(resp=>{
console.log(resp)
var arr = new Uint16Array(resp);
var blobOBj = new Blob([arr], {
type: "application/octet-binary"
});
console.log(blobOBj);
var blobUrl = URL.createObjectURL(blobOBj);
console.log(blobUrl);
});
这段代码需要在 百度首页 的开发者工具控制台中运行,不然有跨域问题。
服务器默认返回的是字节数组类型,将其转换成Blob类型,根据它创建一个blob类型的链接。
原理分析
最早是数据库直接用Blob来存储二进制数据对象,这样就不用关注存储数据的格式了。在web领域,Blob对象表示一个只读原始数据的类文件对象,虽然是二进制原始数据但是类似文件的对象,因此可以像操作文件对象一样操作Blob对象。
video标签,audio标签还是img标签的src属性,不管是相对路径,绝对路径,或者一个网络地址,归根结底都是指向一个文件资源的地址。既然我们知道了Blob其实是一个可以当作文件用的二进制数据,那么只要我们可以生成一个指向Blob的地址,是不是就可以用在这些标签的src属性上,答案肯定是可以的,这里我们要用到的就是URL.createObjectURL()。
const objectURL = URL.createObjectURL(object); //blob:http://localhost:1234/abcedfgh-1234-1234-1234-abcdefghijkl
这里的object参数是用于创建URL的File对象、Blob 对象或者 MediaSource 对象,生成的链接就是以blob:开头的一段地址,表示指向的是一个二进制数据。
其中localhost:1234是当前网页的主机名称和端口号,也就是location.host,而且这个Blob URL是可以直接访问的。需要注意的是,即使是同样的二进制数据,每调用一次URL.createObjectURL方法,就会得到一个不一样的Blob URL。这个URL的存在时间,等同于网页的存在时间,一旦网页刷新或卸载,这个Blob URL就失效。
获取m3u8链接
F12打开开发者工具,网络中搜索m3u8,有可能有多个,要区别出我们想要下载的那个
注:有些网站不是 m3u8 格式,比如 B站
根据链接转为mp4并下载
使用这个网站 m3u8 视频在线提取工具 可以转换。
参考
为什么视频网站的视频链接地址是blob?
关于Video Src 带有 blob:http的视频如何下载的问题
如何将页面blob类型的视频链接下载下来?