在设备之间同步 HTML5 视频答案

【问题标题】：Syncing HTML5 Vidoes Between Devices在设备之间同步 HTML5 视频
【发布时间】：2021-05-22 00:19:42
【问题描述】：

所以我在我的网站上使用 video.js 作为我的视频播放器，但很好奇是否有办法（使用 video.js 或其他视频播放器）能够在网站上的所有设备之间同步视频?

例如，如果 A、B 和 C 正在我的网站上观看此视频，它将同步他们的视频，使他们同时处于同一时间，如果他们中的任何一个暂停，那么三个人都会看到他们的视频暂停？很像 Netflix Party / Youtube Party 的视频。我对 JS 很陌生

【问题讨论】：

【解决方案1】：

可以使用HTMLMediaElement.currentTime 在 JavaScript 中设置和读取视频的当前时间。您也可以play/pause 并检查它是否与the paused attribute 或pause/play 事件一起播放。

您将需要某种形式的后端来跟踪所有这些发生的时间，并将适当的时间/事件传递给所有观看的人，这超出了基本 DOM JS 的范围（尽管如果那是您的事情，也有基于 JS 的后端)。

您可能需要某种形式的实时双向连接，例如websocket。

【讨论】：

我打算使用 websockets，但我的问题是有没有办法让“主”客户端连接到 websocket？如果人 A 正在观看视频并且 30 秒，并且人 B 加入，我想将 video.currentTime() 发送到 websocket，然后转发回 HTML 页面，video.currentTime() 会发送 30 秒或 0 秒（B 的视频时间），以便我可以同步两个视频
我对 websockets 的了解有限，但我想你可以指定一个特定的 websocket 连接作为“主”，只从它读取事件，只向所有其他客户端发送事件
嗯，是的，我正在考虑这样做，我的问题是当视频播放器在一个 JS 文件中时，很难从视频播放器发送参数，以有意义的方式将其发送到 websocket，然后发送回到加入的新用户。
video.js 有自己的 API 用于获取和设置视频元素，例如当前时间和播放/暂停。 docs.videojs.com/docs/api/player.html
嗨，是的，我通读了这些，除非我的视频播放器在 HTML 文件或 JS 文件中，然后我的 websocket 在 server/index.js 文件中，我无法拉由于某种原因，视频播放器时间，当我尝试使用 get 方法时，我得到一个“对象对象”