最近想做一个android+h5视频播放站,主要问题是流量和带宽,首先想到的解决方法是直接将p2p下载模块做到客户端,这样不用走服务器流量。但是没有找到相关技术,只发现了一个web端的 webtorrent
然后想到了...“借用”其他站的视频。打开目标站点,f12找到视频对应的video标签,发现并不是想象中的xxx.mp4,而是这样开头的一个地址
src="blob:https://www.xxx.com/023603e2-0d9f-4398-ba53-027b242f520b"
这明显是加密了视频的真实地址,先不管这个奇怪的东西,有兴趣的同学可以搜一下blob:http
然后尝试在Network查找地址,随着视频播放,发现这样几条信息:
https://xxx.com/x/y/z/xyz/hls-360p0.ts?e=12345&h=d56591aa6ccc48c0
https://xxx.com/x/y/z/xyz/hls-360p1.ts?e=23456&h=6ccc48c0d56591aa
https://xxx.com/x/y/z/xyz/hls-360p2.ts?e=76431&h=aa6cccd5659148c0
...
在新标签页中打开地址,自动下载了一个后缀名为ts的视频文件,时长为10s
所有文件拼起来就是完整的原视频。
经过搜索,知道了这个视频体系是遵循HLS协议,将完整视频切分成一个个小碎片,按需传给用户。
虽然我们是借用视频,不需要自己上传到服务器切分,但是要熟悉下这个流程:
切分视频需要用到一个叫ffmpeg的工具,安装过程我就不复制了,简单说下切分过程
1,将mp4转换为ts:
ffmpeg -i out.mp4 -c copy -bsf h264_mp4toannexb output.ts
2,将ts切分:
ffmpeg -i output.ts -c copy -map 0 -f segment -segment_list playlist.m3u8 -segment_time 10 output%03d.ts
这样就得到一大堆.ts文件和一个.m3u8文件
打开.m3u8文件,发现它是一个播放索引列表
#EXTM3U
#EXT-X-VERSION:3
#EXT-X-MEDIA-SEQUENCE:0
#EXT-X-ALLOW-CACHE:YES
#EXT-X-TARGETDURATION:15
#EXTINF:14.472789,
output000.ts
#EXTINF:10.427078,
output001.ts
#EXTINF:10.427078,
output002.ts
...
...
#EXTINF:10.427078,
output017.ts
#EXTINF:8.883867,
output018.ts
#EXT-X-ENDLIST
其实最开始vedio标签中blob:https:所隐藏的就是这个m3u8文件
通过分析,我找到了他的m3u8文件地址:
https://xxx.com/x/y/z/xyz/hls.m3u8?e=92345&h=5659d1accc48c0a6
所以我们将自己站点中video标签的src地址替换成这个就可以.....是不可能的
有首歌唱得好
没~那么简单
第一个坎是我一直在胡编的后缀参数e=92345&h=5659d1accc48c0a6
e是当前时间戳,h是md5加密的字符串,这个破解不了以我的爬虫水平就无法批量“借用”视频,只能手动找m3u8文件了
打开m3u8文件,发现指向的是另外几个m3u8文件
#EXTM3U
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=423936,RESOLUTION=640x360,NAME="360p"
hls-360p.m3u8?e=92345&h=5659d1accc48c0a6
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=155648,RESOLUTION=444x250,NAME="250p"
hls-720p.m3u8?e=92345&h=5659d1accc48c0a6
因为用的是相对路径,如果自己的站也要分清晰度的话,还要再改二级m3u8文件的内容
注意这里也有个坑,不能用https
#EXTM3U
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=423936,RESOLUTION=640x360,NAME="360p"
http://xxx.com/x/y/z/xyz/hls-360p.m3u8?e=92345&h=5659d1accc48c0a6
#EXT-X-STREAM-INF:PROGRAM-ID=1,BANDWIDTH=155648,RESOLUTION=444x250,NAME="250p"
http://xxx.com/x/y/z/xyz/hls-720p.m3u8?e=92345&h=5659d1accc48c0a6
因为用的是android+h5,现在打开客户端就可以看了。这是因为移动端ios和android都支持HLS协议,可以直接播放。
pc端只有safari支持(毕竟人家自己家的协议嘛),如果要在其他web端看视频,需要安装插件完善h5的播放器,这里提供两种解决办法
1,videojs(<video>)
2,ckplayer(flash)
最后给一个拼合ts文件的bat脚本:
以(hls-720p0.ts~hls-720p31.ts)为例:
@echo off
cd.>new.ts
for /l %%i in (0 1 31) do (
copy /b new.ts+hls-720p%%i.ts=new.ts
)
pause