如何在多个客户端上同步播放 YouTube 视频?

Posted

技术标签:

【中文标题】如何在多个客户端上同步播放 YouTube 视频?【英文标题】:How to play YouTube videos in sync on multiple clients? 【发布时间】:2012-01-15 10:09:32 【问题描述】:

我希望了解如何构建一个允许多个用户在他们的计算机上同步观看同一 YouTube 视频的网络应用。例如,synchtube.com 或 watch2gether.com

我正在寻找一种可以使用phpjQueryApache 等常见技术实现的简单方法。我目前正在考虑轮询(或彗星长轮询,但这需要更复杂的服务器设置,我希望避免),类似于Ajax 聊天应用程序的实现方式 - 即客户端不断检查服务器以查看正在播放哪个视频。但是,我怀疑这里会有延迟问题,因此视频不会完全同步。我还想不出更好的方法。

非常感谢开发人员社区的任何有关方法或代码 sn-ps 的帮助!

【问题讨论】:

我唯一能想到的就是让每个用户都准备好选择。一切准备就绪后,将视频推送给所有人。我会研究使用 php 的 pub/sub 服务。我不确定您正在查看哪种浏览器支持,但我发现各种 websocket 技术对于 pub/sub 来说非常方便。大多数现代浏览器都支持。 使用服务器同步客户端。然后,使用 YouTube javascript 播放器 API 播放视频。请参阅this answer,了解一种简单易懂的视频播放方法。对于更复杂的调用,例如获取玩家的状态和事件,请参阅this answer。 即使所有用户都在同一时刻开始播放视频,但如果有些用户的连接速度较慢,只有在其他应用程序不使用它的某些应用程序时才能跟上视频流,会发生什么情况?带宽?您是否让所有客户都停下来,以免任何人落后? 【参考方案1】:

对我来说,理想的解决方案是使用 Vynch。使用这项技术,您可以在自己的网站中嵌入一个可以同步观看视频的房间。您可以创建播放列表并与朋友和用户分享!还有一个聊天来交流你的印象..

【讨论】:

【参考方案2】:

以下是使用 WebSockets 和 node.js 保持视频同步的示例: http://softwareas.com/video-sync-with-websocket-and-node

我知道你不想使用这项技术,这只是一个很好的起点,可以展示你能做什么以及如何做。

既然您想使用 PHP 并保持简单,那么您最好的解决方案是将实时通信层(用于保持用户视频同步)外包给托管服务,例如我工作的 Pusher。这意味着您无需维护持久连接,您可以使用 Pusher 传递有关用户/客户端之间视频状态的实时事件。

如果您想使用 YouTube 视频,但 html5 并不总是可用,那么您需要使用 Player API。我看不到类似的timeupdated 事件(在 HTML5 视频中可用),因此您可能需要定期检查视频时间(请参阅player status API section。您可以注册状态更改事件,以便知道用户何时暂停、停止视频等

@rob-w 的评论为使用 YouTube API 提供了一些很好的见解。

注意:这实际上可能是一篇非常有趣的博客文章,所以如果你有兴趣,请告诉我,我会看看我能做些什么。

【讨论】:

【参考方案3】:

您有几种方法可以做到这一点:

理想的解决方案是使用实时协作协议和服务器(例如XMPP 和OpenFire)设置并开发自定义模块,允许您来回传递自定义节。不幸的是,它不仅不符合您对所涉及技术的要求,而且实施起来也相当复杂,但结果却是惊人的。

接下来,如果跨浏览器兼容性不是问题,您可以使用 HTML 5 中的 WebSocket API。查看this guy's example,了解如何构建支持 HTML 5 WebSocket 的聊天。

最后,剩下的是 AJAX 轮询,无论是通常的方法还是长轮询,在这些方法中,您都会阻止服务器端脚本的执行,直到您有一些可用的数据。如需进一步参考,请参阅this link。

【讨论】:

另外,看看 NTP 协议在同步时钟时如何处理网络延迟 - 您可能想要实现类似的东西

以上是关于如何在多个客户端上同步播放 YouTube 视频?的主要内容,如果未能解决你的问题,请参考以下文章

让多个嵌入式 Youtube 视频按顺序自动播放

youtube.com 上的视频如何在 iOS 上自动播放

保持两个 YouTube 视频彼此同步

youtube 如何在 Safari 上自动播放带音频的视频?

在 youtube embed 上循环播放视频时如何隐藏播放列表

Youtube 视频显示在冲击波播放器中,而不是 youtube 视频