html - 在 ionic 4 中播放直播

Question

我愿意创建一个应用程序来监控监控摄像头，没什么特别的，只是一个简单的 android 应用程序，可以在主页上实时显示我的摄像头流量，当我点击它时它会全屏显示。 (我稍后会适配安卓电视的应用程序)但我已经搜索了一种通过“视频”标记播放实时流的方法，但它似乎没有用，我找不到适合我的情况的任何教程:/

目前我的应用程序只是一个显示 mp4 的简单 html 文件，所以我没有太多代码可以显示给您

tldr:我正在寻找一种在 ionic 应用程序中播放直播视频的简单方法(如果可能，使用“视频”HTML 标记)

Answer 1

从一些初步研究来看，似乎有很多示例，但它们不适用于 Ionic 4(我正在搜索“ ionic 流媒体示例”)。

有一个ionic 4插件可以播放流媒体:

https://ionicframework.com/docs/native/streaming-media/

有像这样的 ionic 3 教程:

https://www.youtube.com/watch?v=AyS3uw7HZOM

只要您知道如何构建 Ionic 4 应用程序，Ionic 3 教程应该能够很好地展示核心部分，以便您将它们适应 Ionic 4。

如果没有，那么您可能应该先花一些时间学习 Ionic 4，但是有关于 Ionic 3 和 4 之间变化的文档(警告:组件名称和参数有大量变化，但基本思想是一样的)。

尽管从最初的研究来看，您似乎无法满足第一个要求 - 在主页中以缩略图播放流。这需要进一步研究。

根据我的经验，视频会全屏加载。我看过一些关于播放视频预览的教程，但我认为它们是针对本地文件的，不确定如何尝试将多个视频流式传输到您的应用程序。这将占用大量带宽。

如果您可以从相机中获取缩略图快照并且每分钟左右更新一次，那就更有意义了。