在网络浏览器中嵌入IP摄像头

Posted 2021-04-04

我目前正在开发一个智能家居项目，它可以传输传感器和那些东西。主服务器在Raspberry Pi上运行，并使用Node JS设计。在本地网络上，您可以访问系统Web页面并查看日志，用户和管理传感器。

我还想添加相机流媒体。我有一个IP摄像头，我想将它连接到同一个网络，并能够在网页上看到它。我不介意有一些延迟或延迟，我不需要访问我的家庭网络之外的服务。

我搜索了一下，但我找不到任何简单的解决方案。我读到了RTSP和RTMP协议，它们可能对这些情况有所帮助。我还读到有一些可用的插件，比如VLC和Quick Time，但我更喜欢不需要它们的解决方案。显然，html5支持这一点，但我无法继续前进。浏览器支持应该不是问题，因为我假装只使用谷歌浏览器及其最新版本。因此，如果有任何插件易于集成并与Chrome兼容，那应该没问题！

我还发现了一些像这样的服务：

1. https://www.ipcamlive.com/
2. http://rtsp.live/#login

他们似乎提供一些免费服务，但我不确定这是否是最好的解决方案。

那么，任何人都可以帮助解决这个问题吗如何轻松地将视频从IP摄像机流式传输到本地网络中的Web浏览器（即使有延迟或延迟）？

谢谢，伊戈尔！

答案

我解决了这个问题。如果有人有类似的问题，我希望这可能会有所帮助！

为了达到这个目的，就像我在尝试一样，取决于你正在使用的相机。我正在使用rg-ip01相机。有些相机会使用不同的协议和技术。所以我安装了相机并访问了它的IP地址。我检查了网页（在Chrome上），并开始寻找一些线索。有些视图需要ActiveX或Internet Explorer，但移动视图没有，它的HTML是这样的：

<img name="main" id="main" border="0" width="640" height="480" src="http://192.168.1.109:8080/videostream.cgi?loginuse=admin&amp;loginpas=">

我将它插入我的HTML中，它在Chrome上运行良好！将IP更改为相机的IP并检查是否没有定义任何密码（如果是，请在链接中添加字段，并检查用户！）。

我相信这可能因相机而异，但很多人使用相同的软件，所以也许它有效！

谢谢，伊戈尔！

另一答案

几乎所有相机都支持MJPEG流，可以使用IMG标签轻松显示在网络上。然而，MJPEG流需要非常高的带宽（例如，对于百万像素分辨率为20-30mbps）。如果计算带宽消耗，则需要H264 / H265视频流。

问题是IP摄像机使用RTSP协议进行H264 / H265流媒体。不幸的是，这不是Web兼容的。这意味着您需要转换/转码此流，以便能够在网络上播放。如果您想在互联网上发布视频，那么您需要为每个观众提供带宽。

幸运的是，有一些基于云的提供商，如ipcamlive.com，为您完成这项工作。您需要做的就是注册您的相机，然后将代码段复制+粘贴到您的网页：

<iframe src="http://ipcamlive.com/player/player.php?alias=mycameraalias" width="1280px" height="960px"/>

另一答案

IP摄像头流到哪里？好像我没找到流媒体服务器。

• 您需要RTMP服务器，但需要一些IP摄像机内置RTMP服务器。
• ipcamlive是一种流媒体服务。但你需要带宽发送。
• 你不会安装任何插件，但RTMP需要插件，即flash，vlc。您需要转换为HTTP协议。例如HLS，Mpeg-DASH
• 你可以使用nginx-rtmp模块来转换它们。

另一答案

我已经在Github上发布了一个项目，可以帮助你实时流式传输ip /网络摄像头到网页浏览器而不需要插件，我在MIT License下为开源项目做出了贡献，可能与你的需求相匹配，如果你需要尝试检查这个出：

Streaming IP/Network Camera on web browser using NodeJS

目前还没有完整的框架包，但它可以为您提供进一步发展的方法。 作为一名学生，我希望这有用，请为这个项目做出贡献。