基于Html+腾讯云播SDK开发的m3u8播放器
原创基于Html+腾讯云播SDK开发的m3u8播放器
原创
西门吹雪1997
发布于 2023-12-10 21:07:46
发布于 2023-12-10 21:07:46
周末业余时间在家无事，学习了一下腾讯的云播放sdk，并制作了一个小demo（m3u8播放器），该在线工具是基于腾讯的云播sdk开发的，云播sdk非常牛，可以支持多种播放格式。
预览地址
源码地址
https://github.com/geeeeeeeek/m3u8player
开发步骤
第一步：集成播放器SDK：
播放器 SDK 支持 cdn 集成方式：
<link href="https://web.sdk.qcloud.com/player/tcplayer/release/v5.1.0/tcplayer.min.css" rel="stylesheet"/>
<!--播放器脚本文件-->
<script src="https://web.sdk.qcloud.com/player/tcplayer/release/v5.1.0/tcplayer.v5.1.0.min.js"></script>第二步：设置容器
然后，设置播放器容器，在需要展示播放器的页面位置加入播放器容器。可以在 index.html 中加入如下代码（容器 ID 以及宽高都可以自定义）。
<video id="player-container-id" width="414" height="270" preload="auto" playsinline webkit-playsinline>
</video>第三步：初始化并播放
var player = TCPlayer('player-container-id', {
sources: [{
src: 'path/to/video',
}],
licenseUrl: 'https://license-url',
});
// player.src(url); // url 播放地址最终集成后的代码可以参考：
https://github.com/geeeeeeeek/m3u8player
附：m3u8知识
M3U8是一种播放多媒体列表的文件格式，它的设计初衷是为了播放音频文件，比如MP3，但是越来越多的软件现在用来播放视频文件列表，M3U8也可以指定在线流媒体音频源。很多播放器和软件都支持M3U8文件格式。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
原创声明：本文系作者授权腾讯云开发者社区发表，未经许可，不得转载。
如有侵权，请联系 cloudcommunity@tencent.com 删除。
评论
登录后参与评论
推荐阅读