在设备之间同步 HTML5 视频 [英] Syncing HTML5 Vidoes Between Devices

问题描述

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

So I am using video.js as my video player on my website, but was curious if there was a way (either using video.js or another video player) to be able to sync a video between all devices on the website?

例如，如果 A、B 和 C 正在我的网站上观看此视频，它会同步他们的视频，以便他们同时观看，如果他们中的任何一个暂停，则所有三个人都会看到他们的视频暂停?很像 Netflix Party/Youtube Party 的视频.我对 JS 很陌生

For example, if Person A, Person B and Person C is viewing this video on my website, it would sync their video up so they are at the same time, and if either of them pauses then all three people see their video pause? A lot like Netflix Party / Youtube Party for videos. I am quite new to JS

推荐答案

可以使用 HTMLMediaElement.currentTime.您也可以播放/pause 并检查是否使用 暂停属性 或 暂停/播放 事件.

It's possible to set and read the current time of a video in JavaScript with HTMLMediaElement.currentTime. You can also play/pause and check if its playing with either the paused attribute or the pause/play events.

您将需要某种形式的后端来跟踪所有这些发生的时间，并将适当的时间/事件转发给每个正在观看的人，这超出了基本 DOM JS 的范围(尽管有基于 JS 的后端，如果这是您的事)).

You will need some form of backend to keep track of when all of this happens and to relay the appropriate time/events to everyone watching which is outside the scope of basic DOM JS (though there are JS based backends if that's your thing).

您可能需要某种形式的实时双向连接，例如 网络套接字.

You'll probably need some form of live two-way connection like a websocket.

这篇关于在设备之间同步 HTML5 视频的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！