文档中心>播放器 SDK>Web 端播放问题

Web 端播放问题

最近更新时间:2026-07-31 15:28:30

我的收藏
本文主要介绍 Web 端视频播放的几类常见问题及相应解决方案。

视频播放失败

视频播放失败有多种原因,定位问题的基本思路是:
1. 配置网络抓包,查看网络请求情况。
2. 查看浏览器控制台报错情况。
3. 检查视频格式,使用的浏览器是否支持播放。
以下是视频播放失败的几种原因,以及对应的解决方案:

网络

跨协议拦截

问题表现:在 HTTPS 协议的页面播放 HTTP 协议的视频时,浏览器会处于安全考虑进行拦截。
解决方案:HTTP 协议的页面播放 HTTP 的视频,HTTPS 协议的页面播放 HTTPS 的视频。

CDN 无视频

问题表现:访问视频地址返回404。
解决方案:联系我们 定位并修复 CDN 资源。

CDN 鉴权失败

问题表现:访问视频地址返回403,无法加载视频。
解决方案:需确认是否开启 referer 防盗链或者 key 防盗链,视频播放时是否具备校验参数。

微信浏览器拦截

问题表现:在微信无法播放视频,非微信情况下可以播放。
解决方案:需要通过微信申诉解除拦截。

跨域问题

问题表现:在 PC 端无法播放视频,浏览器控制台报跨域相关的错误。
问题背景:在 PC 端使用 Flash 播放视频需要检查视频服务器的crossdomain.xml文件。
crossdomain.xml 的作用
位于www.a.com域中的 SWF 文件要访问www.b.com的文件时,SWF 首先会检查www.b.com服务器根目录下是否有crossdomain.xml文件,如果没有,则访问不成功;如果crossdomain.xml文件存在,且文件内设置了允许www.a.com域访问,则通信正常。
crossdomain.xml中配置的是 SWF 文件的域名。
在 PC 端的现代浏览器使用 HTML5 播放 HLS 和 FLV 时,视频服务器需要配置跨域资源共享 CORS。 正常情况下,腾讯云服务会自动配置这两项跨域策略,如遇到异常情况请 联系我们
解决方案:视频存储服务器需要部署crossdomain.xml文件并配置正确的访问策略,以及开启 CORS 支持。

视频未转码

问题表现:在腾讯云控制台上传视频后,播放器提示视频未转码。
解决方案:对视频进行转码操作,具体操作请参见 处理视频,确保视频编码格式为 H.264,视频封装格式为 MP4 或者 HLS。

异常视频

问题表现:转码后的视频出现花屏、黑屏、卡顿和无法播放等现象,可能是原始视频有问题或者视频转码失败。
解决方案:需要定位原始视频是否有问题,如果是转码问题请 联系我们

浏览器环境不支持播放

通常情况下在 Web 端播放视频依赖浏览器自带的解码器,或者 Flash 解码器,不支持播放会出现 error code 为3或4的错误。浏览器不支持播放的常见问题如下:

浏览器不支持 Flash

问题表现:无法播放 RTMP 和 FLV 格式的视频,或者无法在 IE 浏览器中播放视频。
解决方案:播放 RTMP、FLV 格式的视频以及在 IE 中播放视频都依赖 Flash 插件,请安装并启用 Flash 插件。

浏览器不支持 MSE

问题表现:在 PC 浏览器不支持 Flash 的情况下,使用 H5 方式无法播放 HLS、FLV 格式的视频。
解决方案:不支持 Flash 的情况下,播放器将使用 MSE 播放 HLS、FLV 格式的视频,如浏览器不支持,只能更换或升级浏览器,目前支持通过 MSE 播放 HLS、FLV 格式视频的浏览器有 Edge、Chrome、Firefox 和 Safari11+。

浏览器不支持解码 H264 或者不支持播放 MP4、HLS 格式的视频

问题表现:排除其他情况后仍无法播放 MP4、HLS 格式的视频,通常出现在部分 PC 软件或者 App 集成精简版本的浏览器内核中,没有对应的视频解码器,会出现无法播放 MP4、HLS 格式视频的情况。
解决方案:在 PC 软件或 App 中升级浏览器内核,或者集成 Flash 插件,并允许调用 Flash 插件。

HLS 加密视频播放失败

HLS 加密视频的播放流程有别于常规视频,通常需要确保获取 key 这个步骤是正常的,常见问题如下:

获取 key 失败

问题表现:获取密钥接口无返回,或者返回非密钥数据。
解决方案:检查 m3u8 文件格式是否符合规范,获取密钥的地址是否正确,密钥接口服务端鉴权是否正常,密钥接口是否正常返回。

解密失败

问题表现:获取密钥接口正常返回,仍无法播放。
解决方案:检查密钥长度,确保密钥长度为16字节,并且是能正确解密的密钥。

浏览器劫持视频播放

目前大部分情况下,在网页上播放视频是通过浏览器实现的,浏览器对视频播放拥有最高的处理权限,可以使用浏览器自带的播放器替换原始的 video 控件,并且禁止通过 JS、CSS 修改。劫持播放通常出现在移动端浏览器中,其表现为,播放器的样式不是期望的样式,视频播放时出现额外的 UI 以及广告等内容,或者强制全屏播放等现象。
以下是由于浏览器劫持造成的问题,以及对应的解决方案:

视频激活播放后强制全屏

问题表现:在单击视频激活播放后,直接全屏播放,通常出现在 Android、iOS 的微信、手机 QQ、QQ 浏览器等浏览器中。
解决方案:如需实现页面内(非全屏)播放,需要在 video 标签中加入 playsinline 和 webkit-playsinline 属性,腾讯云播放器默认会在 video 标签中加上 playsinline 和 webkit-playsinline 属性。iOS10+ 识别 playsinline 属性,版本小于10的系统识别 webkit-playsinline 属性。经测试,在 iOS Safari 中可以实现页面内(内联)播放。Android 端识别 webkit-playsinline,但是由于 Android 的开放性,出现了许多定制浏览器,这些属性不一定生效,例如,在 TBS 内核浏览器(包括不限于微信、手机 QQ,QQ 浏览器)中,可能需要使用同层播放器属性(接入文档),避免系统强制全屏视频。
如果已配置以上提到的属性仍会强制全屏,则通用解决方案无效,需要浏览器厂商提供解决方案。

视频无法被其他元素覆盖

问题表现:无法将其他元素覆盖到视频区域上,播放器控件为浏览器自带控件。
解决方案:需要浏览器厂商提供方法解除视频置顶,暂无通用解决方案。

播放器出现多余的图标

问题表现:视频初始化时,视频区域出现非腾讯云播放器自带的图片。
解决方案:可以尝试隐藏 video 标签,当监听到视频开始播放的事件时,再将 video 标签显示。

播放器出现广告、下载、推荐视频等内容

问题表现:视频在播放、暂停、结束时,视频区域出现广告内容,或者下载按钮。
解决方案:需要浏览器厂商提供关闭方法,暂无通用解决方案。

Android 端播放视频不会随着页面滑动

问题表现:在部分 Android 系统浏览器里,页面滑动时,播放器区域不会跟随页面滑动,或者滑动延迟。
解决方案:经过测试发现通过前端方法无法有效解决此类问题,浏览器劫持视频播放后,没有做好优化体验,可以尝试直接使用 video 标签播放(不通过播放器生成)或者尝试使用 Canvas 绘制视频,如果仍无法解决,只能通过升级浏览器来解决。

播放器显示尺寸

播放器出现黑边

问题表现:播放视频时,播放器区域内出现黑边。
解决方案:设置播放器的尺寸比率与视频实际的尺寸比率一致, 例如,视频的分辨率为1280 x 720,播放器的尺寸可以设置为640 x 360或者1280 x 720等,只要满足16:9(1280:720)的宽高比,就能完全显示视频,播放器不会出现黑边。如果视频自带黑边,则需要在转码的时候切掉视频的黑边内容,改变视频的分辨率。

推流端切换横竖屏,播放端不切换

问题表现:推流端设备在推流过程中,进行横竖屏切换,而播放端保持原有的视频比率。
解决方案:Web 播放器目前无法检测到推流端进行了横竖屏切换,只能通过其他途径进行处理。例如,推流开始时是竖屏模式,上行视频宽高比为9:16,Web 播放端播放也是9:16,这时推流设备不断流(是否断流需要推流 SDK 支持)且变成横屏模式,上行视频宽高比变为16:9,如果下行视频也变成16:9,需要将 Web 播放端重新连接才能播放宽高比切换后的视频,这个操作需要外部的接口通知 Web 播放器。 如果下行视频还是9:16,视频将继续按9:16播放。

全屏相关问题

这里主要介绍全屏相关的问题,首先需要了解屏幕全屏(系统全屏)、网页全屏(页面全屏、伪全屏)两个概念。
屏幕全屏:是指在屏幕范围内全屏,全屏后只有视频画面内容,看不到浏览器的地址栏等界面,这种全屏需要浏览器提供接口支持。支持屏幕全屏的接口有两种,一种称为 Fullscreen API,通过 Fullscreen API 进入屏幕全屏后的特点是,进入全屏后仍然可以看到由 HTML CSS 组成的播放器界面。另一种接口为 webkitEnterFullScreen,该接口只能作用于 video 标签,通常用于移动端不支持 Fullscreen API 的情况,通过该接口全屏后,播放器界面为系统自带的界面。
网页全屏:是指在网页显示区域范围内全屏,全屏后仍可以看到浏览器的地址栏等界面,通常情况下网页全屏是为了应对浏览器不支持系统全屏而实现类似全屏的一种方式,所以又称伪全屏。该全屏方式由 CSS 实现。
云点播 Web 播放器采用屏幕全屏为主、网页全屏为辅的全屏方案。全屏模式的优先级为 Fullscreen API > webkitEnterFullScreen > 网页全屏。
由于 Flash 逐步被浏览器限制运行,云点播 Web 播放器采用了 HTML5 标准进行开发,并减少对于 Flash 的使用,在部分老旧的浏览器上,全屏功能使用受限制。旧版点播播放器1.0采用 Flash 开发,使用 Flash 插件实现的屏幕全屏。如需在不支持 Fullscreen API 的浏览器进行屏幕全屏,只能使用旧版点播播放器1.0。
目前已知的全屏情况:
x5 内核(包括 Android 端的微信、手机 QQ 和 QQ 浏览器):不支持 Fullscreen API,支持 webkitEnterFullScreen,全屏后进入 x5 内核的屏幕全屏模式。
Android Chrome:支持 Fullscreen API,全屏后进入带有腾讯云播放器 UI 的屏幕全屏模式。
iOS (包括微信、手机 QQ、Safari):不支持 Fullscreen API,支持 webkitEnterFullScreen,全屏后进入 iOS 系统 UI 的屏幕全屏模式。
IE8/9/10:不支持 Fullscreen API,不支持 webkitEnterFullScreen,全屏为网页全屏模式。
桌面端微信浏览器:不支持 Fullscreen API,不支持 webkitEnterFullScreen,全屏为网页全屏模式 (macOS 微信浏览器目前不支持任何全屏模式)。
其他桌面端现代浏览器:通常支持 Fullscreen API,全屏后进入带有腾讯云播放器 UI 的屏幕全屏模式。

默认全屏播放

视频激活播放后强制全屏,参考其解决方案。

在 iOS Hybrid App 的 WebView 中默认全屏播放

问题表现:在 App WebView 里播放视频默认全屏播放。
解决方案:配置 WebView 的参数 allowsInlineMediaPlayback = YES 允许视频行内播放,即禁止 WebView/UiWebView 强制全屏播放视频。

在 iframe 里使用播放器不能全屏

问题表现:在 iframe 中嵌入播放器页面,单击全屏按钮无效。
解决方案:在 iframe 标签里设置属性 allowfullscreen,示例代码:
<iframe allowfullscreen src="" frameborder="0" scrolling="no" width="100%" height="270"></iframe>

在 IE8、9、10 浏览器中无法全屏

问题表现:IE8/9/10 浏览器使用播放器无法全屏,只能铺满页面区域。或者使用 iframe 嵌入播放页面,iframe 加上 allowfullscreen 属性也不能全屏。
解决方案:在不支持 Full Screen API 的老旧浏览器中,云点播播放器使用 CSS 实现网页全屏,配合浏览器全屏可以实现屏幕全屏效果(浏览器全屏快捷键通常为“F11”),这里需要页面的 CSS 不能限制播放器的页面内全屏样式,如不能设置播放器的父容器overflow:hidden。 如果在 iframe 中,播放器无法修改 iframe 外部的 CSS 样式,需要外部页面提供脚本以及样式支持,通常情况下外部页面需要跨域支持,才能实现网页全屏,因此不建议使用 iframe 的方式使用播放器。
说明
IE8/9/10 浏览器不支持 Full Screen API ,因此不能通过 Full Screen API 进行屏幕全屏。

拖拽、时移播放失败

问题表现:拖拽到某个时间点无法播放,或者跳到片头。
解决方案:避免使用原始视频进行播放,请使用腾讯云转码后的视频进行播放。避免使用 Flash 进行播放,请切换 HTML5 播放模式。如果视频时长过短,关键帧通常只有1个,不支持拖拽播放。

自动播放相关问题

自动播放失败

问题表现:设置了自动播放属性,视频没有自动播放。
解决方案:在许多浏览器中,都禁止了多媒体文件自动播放,特别是移动端浏览器。部分浏览器允许静音视频或者无音轨视频自动播放,因此可以尝试将播放器设置为静音。对于静音也无法播放的浏览器,暂无解决办法。

在 Hybrid App 的 WebView 中自动播放失败

问题表现:在 App WebView 里自动播放失败。
解决方案:需要设置 WebView 关于多媒体自动播放的属性:
iOS:mediaPlaybackRequiresUserAction = NO
Android:webView.getSettings().setMediaPlaybackRequiresUserGesture(false)

错误码常见排查

CODE:3 视频解码异常

问题表现:播放过程中报错 CODE:3,画面卡住或黑屏。
解决方案:分两种情况处理:
1. 视频数据解码异常:iOS 上出现 CODE:3 通常都是这种情况。建议对源视频进行转码;未转码的视频问题最多,点播、直播场景都支持转码操作。Android 环境可通过如下配置切换播放模式:
hlsConfig: {
skipHlsJs: true,
}
2. SourceBuffer 已满导致 append 失败:判断依据是报错后加载也停止(页面持续 loading)。建议升级到 5.2.0 及以上版本,该版本对缓存做过优化;若不便升级,可在播放器初始化时补充如下配置:
hlsConfig: {
maxBufferLength: 10,
maxBufferSize: 40 * 1024 * 1024,
maxMaxBufferLength: 30,
}

CODE:4 媒体资源加载失败

问题表现:播放报错 CODE:4,媒体资源加载失败。
解决方案:常见有两类原因:
1. 网络问题(最常见):定位到具体是服务端、客户端还是运营商的问题,同时建议业务侧监听 error 事件后自动重连:
player.on("error", function(e) {
if (e.data.code === 14 || e.data.code === 4) {
player.src("视频流地址");
}
});
2. 当前环境不支持视频格式或视频数据异常导致兼容问题:使用浏览器支持的格式播放,或对视频进行转码。

CODE:17 切换 DRM 加密视频失败

问题表现:在同一个播放器实例中,从一个 Widevine/FairPlay 加密视频切换到另一个加密视频时,第二个视频播放失败并抛出 CODE:17。
解决方案:这是旧 MediaKeys 未释放导致。5.3.4-beta.46 及以后版本已在内部处理此逻辑。若使用更早的版本,需要在切换前按以下顺序手动清理:先暂停播放、清空 src 并调用 load(),再释放 MediaKeys:
try {
player.pause();
var videoEl = player.el_.getElementsByTagName('video')[0];
videoEl.removeAttribute('src');
videoEl.load();
var p = videoEl.setMediaKeys(null);
if (p && p.catch) { p.catch(function() {}); }
} catch (e) {}
直接 setMediaKeys(null) 而不先暂停/清空 src 会因 video 处于播放状态而失败。另外,部分 Android 浏览器对商业级 DRM 支持有限也会抛出 CODE:17,此时建议改用 SimpleAES 私有加密方案,或引导用户到支持 DRM 的浏览器播放。

CODE:30 hls.js 加载失败

问题表现:因 hls.js 依赖资源加载失败导致播放器报错 CODE:30,海外访问、内网或私有化部署环境尤为常见。
解决方案:在播放器初始化之前手动加载 hls.js,并将其挂载到 window.Hls 上,播放器检测到全局 Hls 后不会再远程加载。tcpcrypto 等其他外部依赖处理方式相同。

CODE:52 License 域名校验失败

问题表现:播放器报错 CODE:52。
解决方案:逐项排查以下情况:
1. 页面 HTML 域名未绑定到 License 后台:到 License 后台将播放页面的域名添加进去。
2. 页面域名刚绑定尚未生效:绑定后需要约20分钟生效。
3. 已绑定但浏览器缓存了旧 License:清除缓存后重试。
4. 绑定的域名和实际访问的域名不完全一致(例如实际是 www.abc.com,绑定的却是 abc.com):与用户核对并绑定完整正确的域名。
5. 页面实际使用的 License 并非绑定了该域名的那份:让用户提供页面或远程比对实际引用的 License。
6. Electron、Hybrid App、打包成 App 的场景无 domain:5.2.0+ 支持通过初始化参数 domain 手动传入一个已绑定的域名。file 协议不支持校验,如需本地调试请改用 localhost。

CODE:53 License 时间校验失败

问题表现:播放器报错 CODE:53。
问题背景:播放器在每次校验 License 时会将本次时间记入本地,下次播放时对比,若本次时间早于上次记录,则判定为时间校验失败。
解决方案:核实业务侧是否存在主动修改设备时间的逻辑(如有需业务侧规避);若是终端用户主动修改设备时间导致,建议用户不要改动系统时间。

CODE:56 获取 License 数据失败

问题表现:播放器报错 CODE:56,无法拉取到 License 数据。
解决方案:较新版本内置了 License 备用域名机制,建议先升级 SDK 到较新版本再重试。

CODE:51 License 过期

问题表现:播放器报错 CODE:51。
解决方案:License 已过期,请到控制台续期。

CODE:61 安全插件 API 校验失败

问题表现:播放器报错 CODE:61(type: SAFECHECK_ERR),部分场景下会不稳定复现。
问题背景:安全插件(SafeCheck)对播放器 API 调用做了完整性校验,若检测到关键 API 被劫持、Hook 或重写,会抛出 CODE:61。
解决方案:先排查页面是否存在对 video/播放器方法的重写、代理或第三方脚本注入;如业务无需内嵌安全插件,可使用去除安全插件的 SDK 版本。

CODE:62 MSE 环境检测异常

问题表现:播放器报错 CODE:62(type: SAFECHECK_ERR)。
问题背景:播放器内嵌了安全检测插件,用户侧一些异常操作(如页面被篡改、MSE 相关 API 被 Hook 等)会触发该错误。
解决方案:如业务无需内嵌安全插件,可使用去除安全插件的 SDK 版本;如需保留安全插件,请检查页面是否存在对 MediaSourceSourceBuffer 等 API 的重写或代理。

加密与 DRM 相关问题

FairPlay 加密视频在 iOS 无法播放

问题表现:使用 FairPlay 加密的视频在 iOS 上无法播放。
解决方案:通常是生成 psign 时缺少必要参数,参考 商业加密文档 检查 psign 的生成规范。

SimpleAES 加密视频在 iOS 微信 H5 播放失败

问题表现:iPhone 微信 H5 无法播放 SimpleAES 加密视频。
解决方案:iOS 微信浏览器对 SimpleAES 私有加密支持有限,建议改用 WebView 嵌入 TCPlayer Web 版本进行播放。

Widevine 防录屏能力有限

问题表现:Widevine 加密视频在部分 Android 浏览器和老版本 Firefox 上依然可以被录屏。
解决方案:防录屏行为完全由浏览器的 Widevine CDM 实现决定,并非 W3C EME 规范约束的能力,SDK 侧无法干预。已确认 Firefox 138 版本防录屏不生效,升级到 153 版本后生效;防录屏生效时录屏画面显示为一张类似封面的静态图,非全黑,属正常表现,hls.js 官方 demo 在同样环境下行为一致。

猫抓等抓包插件可抓取 HLS 加密资源

问题表现:使用 HLS 加密后仍可被"猫抓"等浏览器扩展抓取资源。
解决方案:升级到 5.3.4 及以上版本,该版本对抓包插件做了拦截处理。

直播与 WebRTC 相关

WebRTC 直播接收 SEI 消息

问题表现:需要在 WebRTC 直播流中接收 SEI 附加消息。
解决方案:在初始化时于 webrtcConfig 中配置 receiveSEI: true(该配置会透传给底层 TXLivePlayer),并在业务侧通过 player.on('webrtcsei', handler) 监听 SEI 事件消费数据:
player.on('webrtcsei', function(e) {
console.log('SEI 数据:', e.data);
});

FLV 播放报 Maximum buffering duration / SourceBuffer is full

问题表现:播放过程中控制台出现 [FlvPlayer] Maximum buffering duration exceeded, suspend transmuxing taskMSE SourceBuffer is full, suspend transmuxing task,画面可能卡住。
解决方案:这是缓冲/内存堆积导致的 transmux 暂停。可在初始化中通过 flvConfig 开启自动清理(enableStashBuffer SDK 默认已为 false):
flvConfig: {
autoCleanupSourceBuffer: true, // 开启自动清理
autoCleanupMaxBackwardDuration: 15, // 已播放数据保留 15 秒后清理
autoCleanupMinBackwardDuration: 10,
}
若源流码率过高,还建议对推流数据做转码降码率,同时配合监听画面卡住 5 秒后自动重连的策略提升鲁棒性。

iOS 直播结束监听不到 error 事件

问题表现:iOS 上直播异常或结束时未触发 error 事件。
解决方案:这是 iOS 系统层限制,播放器只有在收到系统抛出的事件时才能对外抛出,无法从 SDK 侧兜底。业务侧可结合后台推流状态等其它信号辅助判断。

海外访问首帧加载慢

问题表现:海外用户访问部署在国内地域的资源时,首帧加载明显偏慢。
解决方案:将资源存储切换到就近地域(例如美国用户使用美国存储),并将播放器的 playcgi 接口切换为对应的海外域名,可显著改善首帧速度。同时建议客户网络策略放通相关海外服务域名(如 overseas-webrtc.tliveplay.comlicense.vodgldn.com 等),避免拉流或数据上报被拦截。

播放画质与声音问题

有声无画(黑屏但有声音)

问题表现:播放时有声音但没有画面。
解决方案:多数情况下是视频使用了 H.265 编码,Web 端不同浏览器对 H.265 兼容性差异较大,最常见的表现就是"有声无画"。改用 H.264 编码即可解决。若已确认是 H.264 仍黑屏,可能是视频数据编码本身异常,可用 hls.js/flv.js 或原生 <video> 标签对比测试,如同样无法播放需从源头修复编码数据。

主副视频交替播放后声音变电音

问题表现:页面存在多个 <video> 时(例如主视频播放中暂停后切副视频,副视频结束再切回主视频),主视频声音变为类似"电音"或"金属音"的异常。
问题背景:旧版本(V4)内置的 hls.js 默认走 Web Audio API 解码音频,浏览器在处理其它 <video> 播放/停止时可能重置 AudioContext,导致主视频恢复播放时音频节点采样率错乱。
解决方案:升级到 5.x 版本。V5 已升级 hls.js 并默认使用 MSE + 原生解码,不再依赖 Web Audio API,不会受其它 <video> 元素干扰。

走浏览器原生 HLS 时长视频跳片段播放

问题表现:hlsConfig.skipHlsJs 设置为 true 走浏览器原生 HLS 解析时,长视频出现跳片段、乱序播放。
解决方案:这是浏览器原生 HLS 播放的已知 bug,改回使用 hls.js(即 skipHlsJs: false,默认值)解析 m3u8 即可。

特殊环境集成问题

uni-app 环境无法初始化播放器

问题表现:uni-app 里初始化播放器报错 "The element type must be <video>"。
问题背景:uni-app 框架自身创建了 <uni-video> 组件,占用了原有的 video id,导致播放器渲染异常。
解决方案:动态创建原生 <video> 标签并挂载后再初始化播放器;对于小程序类环境无法直接集成 TCPlayer 的,建议使用 WebView 承载 Web 版播放器。

销毁播放器后重新初始化报错找不到元素

问题表现:调用 dispose 销毁播放器后再重新初始化,提示找不到对应的 video 元素。
问题背景:销毁过程会同时销毁 video 标签。
解决方案:再次初始化前需要重新创建 video 元素。

内网 / 私有化部署无法访问外部依赖

问题表现:内网或私有化部署环境下,播放器请求 hls.js、tcpcrypto 等外部资源失败,导致播放异常。
解决方案:将相关依赖下载后部署到内网可访问的位置,在播放器初始化前手动加载并挂载到全局对象上(例如 window.Hlswindow.tcpcrypto),播放器检测到全局对象存在后就不会再发起远程加载。

频繁创建/销毁播放器实例导致报错或内存持续上涨

问题表现:同一页面短时间内反复创建和销毁播放器实例,出现报错或内存不断增长。
解决方案:确保前一个实例完全销毁(dispose 完成)后再创建新实例,避免并发的初始化 / 销毁操作,也避免销毁未完成就发起新的创建。

功能与交互相关

隐藏右键菜单的"腾讯云提供技术支持"

问题表现:播放器区域右键菜单会显示"腾讯云提供技术支持"字样,希望移除。
解决方案:监听 contextmenu 事件自行拦截右键菜单,可参考官方拦截鼠标右键事件的示例 demo 实现。

播放器控件按钮显示不全

问题表现:在窄屏或宽度受限的容器中,播放器右下角部分按钮(如全屏按钮)显示不完整。
解决方案:通过 CSS 调整控件样式,例如 transform: scale(...) 缩小整体、padding 微调间距,或隐藏不必要的按钮释放空间。

进度条打点标记

问题表现:需要在进度条上打点标记特定时间点。
解决方案:通过 plugins.ProgressMarker 传入标记数组进行配置。当前不支持按时间段给进度条上色。

自定义倍速

问题表现:希望设置 3x、4x 等超出默认列表的倍速。
解决方案:通过 player.playbackRate(3) 可直接设置任意倍速。
注意:
1.1 倍速较为特殊(用于内部动态追帧能力),不会作为倍速选项在 UI 上展示。

感知 HLS 音轨切换是否完成

问题表现:HLS 多音轨场景下,需要区分"开始切换"和"切换完成"两个状态。
解决方案:通过内部的 hls.js 实例监听 AUDIO_TRACK_SWITCHING(开始切换)和 AUDIO_TRACK_SWITCHED(切换完成)事件。5.3.4-beta.36 及以后版本可通过 player.tech_.hlsProvider 访问内部 hls 实例。

License 支持多域名 / 泛域名

问题表现:同一业务下多个域名需要使用播放器 License。
解决方案:在 License 后台配置泛域名,或申请多张 License 按域名分发使用,具体方案可根据业务规模选择。

全屏后再退出全屏,直播画面暂停

问题表现:点击全屏进入再退出后,直播画面停在暂停状态。
解决方案:这是部分浏览器在全屏切换时的默认行为,SDK 自身不会主动暂停。业务侧可监听 fullscreenchange 事件,在退出全屏时再调用 play() 恢复播放。

其他问题

播放器初始化后看不到视频画面

问题表现:播放器初始化后,未开始播放前,看不到视频的画面,播放器区域黑屏。
解决方案:Web 播放器是否显示视频的首帧画面取决于该浏览器是否支持,目前并非所有浏览器都支持首帧画面,解决方案为设置视频的封面。

播放器没有变速播放按钮或者变速功能不可用

问题表现:在某些浏览器播放视频没有变速播放按钮或者变速播放功能不可用。
解决方案:目前只有部分现代浏览支持 HTML5 播放模式的变速播放功能,且 Flash 播放模式不支持变速播放,因此不支持 HTML5 模式播放的浏览器也不支持变速播放。可以优先使用 HTML5 模式播放,如果没有出现变速播放按钮,说明当前播放模式不支持变速播放;如果出现变速播放按钮,但切换没有效果,说明播放器检测到当前浏览器支持设置变速播放接口,但实际设置后没有效果,建议在此浏览器下隐藏变速播放按钮。