如何在 Electron 中显示 RTSP 流？

Posted 2023-02-19

【中文标题】如何在 Electron 中显示 RTSP 流？

【英文标题】：How to display RTSP stream in Electron?

【发布时间】：2017-07-17 00:28:40

【问题描述】：

我有一个使用 UDP 协议的视频流，可通过 rtp://ipadd:port 或 udp://@:port 访问。我完全无法控制服务器，因此我无法将其更改为通过 WebSocket 提供流或即时将其转码为兼容格式。

我想在 Electron 应用程序中显示流，但是我从 Google 搜索中找到的所有资源都告诉我，我希望完成的任务需要我使用 webchimera.js 之类的东西来组合一个不受欢迎的 hacky 解决方案，因为例子。

我尝试按照this answer, 将URL 放入<video> 标记中，但Electron 说udp 和rtp URL 方案无法识别。我还尝试了require('child_process').exec 与ffplay 的静态构建，它可以工作，但它在整个单独的窗口上显示流，这不是我想要的。 ActiveX、NPAPI 和其他插件解决方案不是一个选项，因为 Electron 不支持它们。

是我运气不好，还是我还没有找到解决方案？

【参考方案1】：

通过查看其他人的代码的页面和页面来弄清楚。

显然，我对 WebSockets 的最初理解是不正确的——在我的情况下，我不需要更改服务器端即可使用 WebSockets。

我必须使用 ffmpeg Node.js 包装器将 Electron 中的流转码为 MPEG2，该包装器将视频发送到 Express 服务器实例，然后该服务器实例在由 jsmpeg 呈现的静态网页中提供视频。然后，静态网页在 Electron 应用程序主页面中显示为 IFrame。

生成的流比使用ffplay 播放原始 UDP 流时看到的视觉伪影要多得多，这种方法可能会引入很多延迟，但它足以满足我的需求。

【讨论】：

嘿，dantis，您介意分享您用于实现该解决方案的代码吗？我正在开发一个符合这些要求的 Electron 应用程序。

@ErikMartínJordán 嗨，埃里克！我相信this commit 是你想要的。恐怕我无法提供进一步的帮助 - 我已经有一段时间没有放弃这个项目了:(

谢谢，伙计！我会看看。我在这个问题上挣扎了很多。干杯！