直播字幕需通过hls.js或MSE实现，原生标签对HLS/RTMP直播流无效；必须在m3u8中声明EXT-X-MEDIA字幕轨、hls.js启用renderSubtitles:true、video加crossorigin="anonymous"；VTT须符合时间格式、递增不重叠、分块渐进加载且Content-Type:text/vtt。
用
原生 标签本身不支持对纯直播流（比如 src="https://xxx/live.m3u8" 或 src="rtmp://..."）直接挂载外挂字幕文件。浏览器只允许在使用 Media Source Extensions（MSE）手动喂数据，或 HLS 播放器（如 hls.js）接管后，再动态注入字幕轨道。
如果你硬写 在直播 上，绝大多数情况字幕不会出现——因为 HLS/m3u8 流里没声明 EXT-X-MEDIA 字幕轨，浏览器根本不会加载它。
- 真正起作用的是：hls.js 加载 m3u8 时识别其中的字幕 track 声明，并把 WebVTT 数据解析后传给
的textTracks - 自己手写
只对本地文件、点播 MP4 + VTT 这类静态场景可靠 - RTMP 流必须转封装为 HLS 或 MSE 可消费的 fragmented MP4 才能加字幕
hls.js 中启用字幕需满足三个硬条件
哪怕你用了 hls.js，字幕也不会自动弹出来。必须同时满足：
- m3u8 文件里有合法的
EXT-X-MEDIA字幕声明，例如：EXT-X-MEDIA:TYPE=SUBTITLES,GROUP-ID="subs",NAME="中文",DEFAULT=YES,AUTOSELECT=YES,LANGUAGE="zh",URI="sub_zh.vtt"
- hls.js 实例初始化时开启
renderSubtitles: true（v1.0+ 版本默认 false） -
元素上要加crossorigin="anonymous"，否则 VTT 文件跨域加载失败，控制台报Failed to load resource: net::ERR_FAILED
漏掉任一条件，video.textTracks.length 都会是 0，字幕轨道压根没注册进去。
生成可在 deepbi 沙箱 iframe 内运行或作为独立文件运行的交互式 HTML 页面，使用 `window.deepbi` JS SDK 实现数据查询、空间管理、文件浏览及用户操作。当用户提出以下需求时启用该能力： - 创建 KPI 仪表盘、数据表格、文件浏览器、成员列表、管理页面； - 明确要求“转成 dhtml”、“转译成 HTML”、“把 XX 页面转成……”、“控制台页面”、“管理后台”、“DeepBI 页面迁移”； - 提及位于 `apps/console/src/featur
动态切换字幕语言要用 textTracks API，不是改
字幕轨道一旦由 hls.js 注入，就变成只读的 TextTrack 对象，不能通过 JS 修改 标签的 src 或 srclang 来切换——那些属性早已失效。
- 查可用轨道：
video.textTracks返回TextTrackList，遍历看track.kind === 'subtitles'和track.language - 启用某条：
track.mode = 'showing'；禁用全部：for (const t of video.textTracks) t.mode = 'disabled' - 别调用
addTextTrack()手动添加——hls.js 管的轨道不允许重复添加，会报InvalidStateError
VTT 文件内容必须符合直播场景的特殊要求
直播字幕的 VTT 不是简单写几段时间轴就行。hls.js 要求每条 cue 必须有明确起止时间，且不能重叠、不能倒序，否则解析失败静默丢弃。
- 时间格式严格为
HH:MM:SS.mmm，毫秒必须三位，00:01:23.456✅，00:01:23.45❌ - 每条 cue 必须有唯一 ID（可选），但起止时间必须递增，且当前 cue 的 start 时间 ≥ 上一条的 end 时间
- 如果字幕是服务端实时生成的，务必保证 VTT 响应头含
Content-Type: text/vtt，否则 hls.js 不认
最常被忽略的一点：直播字幕 VTT 文件本身也得是「渐进式」加载的——不能等整段播完才吐出全部内容，而要按 chunk 分批返回，否则播放器卡住不动。
前端入门到VUE实战笔记：立即使用
在学习笔记中，你将探索 前端 的入门与实战技巧！
