如何在浏览器中实时播放图像？

我正在尝试创建一个应用程序，以在电子书阅读器的浏览器中镜像手机的屏幕。这个想法是持续制作屏幕截图，并使其可从手机上运行的http服务器获取。到目前为止，我已经成功在电话上运行了http服务器并共享了最新的屏幕截图。现在，我想在浏览器中自动更新图像-应该使用哪种机制-网站应该每隔x毫秒提取一次图像，还是可以从服务器推送更改？图像过渡应平稳进行。电子书的浏览器受到某种程度的限制，例如，它不支持html5-video和其他许多功能。我使用的是基本的dart httpServer（因为我的应用程序非常混乱），并且希望保持其基本状态。为了进行测试，我有一个png屏幕截图，但是我也想优化灰度，如果浏览器支持的话，也许还可以尝试使用canvas做一些事情（这里没有经验）。

主要问题：-是否有一种简单的方法将更改从服务器推送到浏览器？-如何在图像之间实现平滑过渡（如果图像未更改，则跳过刷新）？-使用图像有哪些替代方法？-帆布能以某种方式帮助我吗？

我认为最好在这里使用WebRTC。浏览器提供getDisplayMedia，可让您捕获选项卡或设备的整个显示。

然后，您可以连接两个设备，并实时传输捕获内容。另一件好事是它将是P2P，您应该看到亚秒级的延迟（并且您没有运行HTTP服务器的额外复杂性）。

您需要的是一个信令服务器，用于在两个对等方之间发送要约/答案/ ICE候选者。这些消息只是启动呼叫的“引导程序”详细信息。

如果getDisplayMedia在设备上不起作用，则可以通过本机应用程序添加WebRTC。 flutter-webrtc是一种可能的解决方案。