开发者API文档
发布于 2025-12-10
欢迎使用PlayM3U8 API文档。本文档提供了完整的API接口说明、参数详解和代码示例。
🚀 快速开始
引入资源
<!-- 引入播放器CSS --> <link href="https://web.sdk.qcloud.com/player/tcplayer/release/v5.1.0/tcplayer.min.css" rel="stylesheet"> <!-- 引入播放器JS --> <script src="https://web.sdk.qcloud.com/player/tcplayer/release/v5.1.0/tcplayer.v5.1.0.min.js"></script>
创建播放容器
<video id="player" preload="auto" playsinline webkit-playsinline></video>
📖 基础用法
最简单的播放示例
const player = TCPlayer('player', {
sources: [{
src: 'https://example.com/video.m3u8'
}]
});⚙️ 配置参数
| 参数名 | 类型 | 必填 | 说明 |
|---|---|---|---|
| sources | Array | 必填 | 视频源数组 |
| autoplay | Boolean | 可选 | 是否自动播放，默认false |
| controls | Boolean | 可选 | 是否显示控制条，默认true |
| preload | String | 可选 | 预加载策略：auto/metadata/none |
| poster | String | 可选 | 视频封面图URL |
🔧 方法参考
play() - 播放视频
player.play();
pause() - 暂停播放
player.pause();
src(url) - 设置视频源
player.src('https://example.com/new-video.m3u8');
currentTime([seconds]) - 获取/设置播放位置
// 获取当前时间 const time = player.currentTime(); // 跳转到30秒位置 player.currentTime(30);
dispose() - 销毁播放器
player.dispose();
📡 事件监听
// 播放开始
player.on('play', function() {
console.log('开始播放');
});
// 播放暂停
player.on('pause', function() {
console.log('播放暂停');
});
// 播放结束
player.on('ended', function() {
console.log('播放结束');
});
// 错误处理
player.on('error', function(error) {
console.error('播放错误：', error);
});⚠️ 注意事项
- • M3U8地址必须支持CORS跨域访问
- • 移动端Safari需要用户手动触发播放
- • 部分浏览器不支持自动播放功能
- • 确保视频编码格式兼容目标浏览器