前往小程序,Get更优阅读体验!
立即前往
首页
学习
活动
专区
工具
TVP
发布
社区首页 >专栏 >jsDelivr存储视频.m3u8

jsDelivr存储视频.m3u8

作者头像
qiangzai
发布2021-12-21 08:47:25
2.1K0
发布2021-12-21 08:47:25
举报
文章被收录于专栏:强仔博客

对于博客来说,媒体资源的存取方式至关重要,作为资深的老白嫖怪,借助Jsdelivr加速Github上存储的图片已经是公认的方案,但对于视频来说,面对动辄几百兆的视频资源,你几乎无法找到一个免费的“视频床”,在第三方直接防盗链能力日渐完善的当下,急切需要一种折中方案。本文就借鉴前辈的尝试,将视频存放在Github之上并利用Jsdelivr实现加速,并利用DPlayer将其插入到自己的博客中,大多数影视站就是这么淦的,所以咱也来试试。

实现原理

用到的工具有 Git Bash 和 ffmpeg ,Git工具就不用介绍了,ffmpeg用于视频切分,这涉及到HLS技术,解释如下: HLS 的工作原理是把整个流分成一个个小的基于 HTTP 的文件来下载,每次只下载一些。当媒体流正在播放时,客户端可以选择从许多不同的备用源中以不同的速率下载同样的资源,允许流媒体会话适应不同的数据速率。在开始一个流媒体会话时,客户端会下载一个包含元数据的 extended M3U (m3u8) playlist文件,用于寻找可用的媒体流。HLS 只请求基本的 HTTP 报文,与实时传输协议(RTP)不同,HLS 可以穿过任何允许 HTTP 数据通过的防火墙或者代理服务器。它也很容易使用内容分发网络来传输媒体流。 在我们的场景中,可以理解为视频的 url 就是 playlist 的链接地址,而 playlist 可以看做是视频分片的索引,如此大的视频被拆分,即绕过存储的单位件大小限制,同时也符合Jsdelivr对资源的要求,这样存储的视频,就可以“变相”的将Github做为视频床了。

文本教程

这里推荐新建一个仓库来存储视频,如果被认定滥用而封禁,也只会影响这一个仓库,所以还是新建一个仓库。在本地新建个文件夹,将原视频放进去,将 ffmpeg.exe 也放进去,准备工作完成。

1
1

在此目录下,右键选择 Git_Bash_here(前提是安装Git工具),然后将 ffmpeg.exe 直接拖入黑框中,回车,会显示ffmpeg的信息,下面就可以开始视频切片了 执行切片 第一步:mp4转成ts格式,一对一转换,直接输入命令, qiangzaitest为视频文件名称

代码语言:javascript
复制
ffmpeg -y -i qiangzaitest.mp4 -vcodec copy -acodec copy -vbsf h264_mp4toannexb qiangzaitest.ts

$(document).ready(function(){$(".galleryidpost").lightGallery({selector: ".yoniu-index-img",share: false,share: false,showThumbByDefault: false,autoplayControls: false});});

执行完毕会多一个ts文件,转换后大小没什么变化

4
4

第二步,按间隔分片,1对N,下面的5即“每个分片5秒”,可以自己切换。

代码语言:javascript
复制
ffmpeg -i qiangzaitest.ts -c copy -map 0 -f segment -segment_list playlist.m3u8 -segment_time 5 qiangzaitest%03d.ts

$(document).ready(function(){$(".galleryidpost").lightGallery({selector: ".yoniu-index-img",share: false,share: false,showThumbByDefault: false,autoplayControls: false});});

执行完毕会多很多个ts文件。

7
7

最后一步:删掉或移除原视频和转换后的ts视频( qiangzaitest.mp4 and qiangzaitest.ts )以及 ffmpeg.exe ,都移除去,剩下的就只有playlist和一大堆分片,上传仓库。

8
8

使用DPlayer解析

这不是单纯的视频切分,如果你不信,可以尝试访问单独的视频分片,基本都是乱码: https://cdn.jsdelivr.net/gh/qiangzaia/qz/test/qiangzaitest000.ts 当然,直接试图访问m3u8链接也是不行的,这里需要 hls.js 。 https://cdn.jsdelivr.net/gh/qiangzaia/qz/test/playlist.m3u8

hls.js 是一款基于 Media Source Extensions 开发的,用于实现 HTTP Live Streaming 开源JavaScript类库。它可以实现将MPEG-2 和 AAC/MP3码流变成自制的 MP4的分片。并且可以直接绑定在Video 上,实现播放。 当然一般解析里面都有的

9
9

最终效果(jsd加速) https://q6q.cc/m3u8/?url=https://cdn.jsdelivr.net/gh/qiangzaia/qz/test/playlist.m3u8

10
10

文件下载

ffmpeg.exe Git工具

本文参与 腾讯云自媒体同步曝光计划,分享自作者个人站点/博客。
原始发表:2021-04-137,如有侵权请联系 cloudcommunity@tencent.com 删除

本文分享自 作者个人站点/博客 前往查看

如有侵权,请联系 cloudcommunity@tencent.com 删除。

本文参与 腾讯云自媒体同步曝光计划  ,欢迎热爱写作的你一起参与!

评论
登录后参与评论
0 条评论
热度
最新
推荐阅读
目录
  • 实现原理
  • 文本教程
  • 使用DPlayer解析
  • 文件下载
相关产品与服务
内容分发网络 CDN
内容分发网络(Content Delivery Network,CDN)通过将站点内容发布至遍布全球的海量加速节点,使其用户可就近获取所需内容,避免因网络拥堵、跨运营商、跨地域、跨境等因素带来的网络不稳定、访问延迟高等问题,有效提升下载速度、降低响应时间,提供流畅的用户体验。
领券
问题归档专栏文章快讯文章归档关键词归档开发者手册归档开发者手册 Section 归档