添加/修改交互式直播视频的叠加内容

Question

我正在构建一个Web应用程序，用于使用HLS协议管理直播视频。我有一个使用vuejs来管理流内容的CMS，现在是对直播频道列表的api响应，其中包括直播.m3u8的网址。

问题：

• 从api响应的实时信息中，我想向当前的实时视频中添加其他内容，以允许用户在观看实时视频时与之交互以创建交互式实时视频。其他内容是html，例如：输入表单，链接等...，它是实时流视频屏幕在特定位置的显示覆盖。下图是一个示例：
• 创建其他内容后，我将通过调用api对其进行发布以提交此更改。
• 然后，更改将更新为用户，并且用户可以与叠加内容进行交互。

我不知道添加/修改覆盖内容以便于维护的最佳解决方案 希望您能帮助解决此问题。 谢谢你，