如何在流离线时显示图像

Question

我正在使用 videojs 和运行带有 nginx 和 hls 流的服务器。我在想如何在流离线时显示图像，然后在流开始播放时显示图像。感谢您的帮助

Answer 1

当 HTML5 视频播放器播放流时，它通常通过请求服务器向其发送视频文件来执行此操作，通常实际上是请求流的每个新块。

在您的情况下，您似乎希望播放器仅在流准备就绪时才开始请求，或者至少让用户看起来像这样。

要实现这一点，您可以简单地定期轮询服务器，比如每秒轮询一次，以查看流是否准备就绪，或者您可以使用从服务器到页面的某种形式的通知。

从表面上看，通知似乎更有效，但您可能会发现您使用的任何通知机制无论如何都必须轮询服务器。

为了让您在流结束时显示图片，您还可以在没有更多流可用时在播放器中捕获这种情况，然后回退以显示图像。

$myVid = $("#video_id");

$myVid.addEventListener('play', function(){
   // do something
})
$myVid.addEventListener('pause', function(){
   // do something
})

如何在流离线时显示图像

How to make image show when stream is offline

streaming

nginx

video.js