RealtimeKit 的交互式录制功能允许您向视频流添加定时元数据。定时元数据可用作客户端显示信息和触发时间对齐操作的提示点。对于客户端,元数据在播放时间线上以 ID3 ↗ 标签的形式提供。
有没有想过 Netflix 如何在进度条上显示缩略图,或者在 Hotstar 上看板球比赛时如何显示额外内容?这都是在视频流本身内部的特定时间插入的元数据,称为定时元数据。
定时元数据是带有时间戳的元数据。它是指添加到视频文件中,以便在内容范围的特定点提供额外上下文和信息的数字标记。使用 Start recording a meeting API 中的 interactive_config,可以通过编程方式将这些数据点插入到流中。
一旦 RealtimeKit 处理了流,定时元数据就会与音频和视频帧同步。所有观众在播放期间都可以在流的相同相对时间看到此元数据。时间码起着提示点的作用,并且可以根据数据触发特定操作。例如:
这些功能是通过使用嵌入在视频分片中的 ID3 标签来实现的,从而使其在录制的视频中可用。
要为您的 RealtimeKit 录制添加交互性,请执行以下步骤:
- 在 Start recording a meeting API 中,传递
interactive_config参数。
此参数允许您向录制添加定时元数据,该元数据通过 ID3 标签以 HLS 格式提供给客户端。输出文件打包为 tar 文件。
- 在 RealtimeKitClient ↗ 中,在 participants ↗ 对象上调用
broadcastMessage方法,参数为ID3(作为字符串)和yourData(您想作为定时元数据发送的数据)。
meeting.participants.broadcastMessage(“ID3Data”, yourData);- 要停止发送数据,请调用以下方法。调用之后,您将无法再发送其他 ID3 数据。
meeting.participants.broadcastMessage(“ID3Data”,”CLOSE_TRANSPORT”)如果您不传递此参数,当录制停止时,ID3 元数据流将自动关闭。
- 录制完成后,您您可以获取包含视频分片和播放列表文件的 tar 文件。
download_url提供了指向 tar 文件的链接。下面是 tar 文件的示例截图:
同样需要注意的是,每个分片的长度取决于视频的帧。因此,每个分片的长度可能不尽相同,不过通常接近启动录制时指定的分片长度。默认情况下,分片长度设置为 10 秒。
- 您可以使用
hls.js↗ 播放该流。
const onFragChanged = (_) => {
// We first try to find the right metadata track.
// https://developer.mozilla.org/en-US/docs/Web/API/TextTrack
const textTrackListCount = videoEl.textTracks.length;
let metaTextTrack;
for (let trackIndex = 0; trackIndex < textTrackListCount; trackIndex++) {
const textTrack = videoEl.textTracks[trackIndex];
if (textTrack.kind !== 'metadata') {
continue;
}
textTrack.mode = 'showing';
metaTextTrack = textTrack;
break;
}
if (!metaTextTrack) {
return;
}
// Add an oncuechange listener on that track.
metaTextTrack.oncuechange = (event) => {
let cue = metaTextTrack.activeCues[metaTextTrack.activeCues.length - 1];
console.log(cue.value.data);
};
};
// listen on Hls.Events.FRAG_CHANGED from hls.js
hls.on(Hls.Events.FRAG_CHANGED, onFragChanged);