在web浏览器中嵌入IP摄像机
我目前正在做一个智能家居项目，它把传感器和其他东西连接起来。主服务器运行在Raspberry Pi上，并使用Node进行设计。在本地网络上，您可以访问系统网页，查看日志、用户和管理传感器。
我也想添加一个相机流。我有一个IP摄像头，我想把它连接到同一个网络，并且能够在网页上看到它。我不介意有一些延迟或延迟，我不需要访问我的家庭网络以外的服务。
我找了一下，但找不到任何简单的解决办法。我读过关于RTSP和RTMP协议的文章，它们在这些情况下可能会有所帮助。我读到有一些插件是可用的，比如VLC和Quick，但是我更喜欢不需要它们的解决方案。显然，HTML5支持这一点，但我无法在这方面取得进展。浏览器支持不应该成为一个问题，因为我假装只使用谷歌Chrome和它的最后一个版本。因此，如果有任何插件是容易集成和兼容的Chrome，这应该是好的！
我还发现了一些类似的服务：
- https://www.ipcamlive.com/
- http://rtsp.live/#login
他们似乎提供了一些免费服务，但我不确定这是否是最好的解决方案。
有谁能帮上忙吗？如何轻松地将视频从IP摄像机传输到本地网络中的Web浏览器(即使存在延迟或滞后)？
谢谢伊戈尔！
回答 5
Stack Overflow用户
发布于 2017-10-29 23:18:57
我解决了这个问题。如果有人有类似的问题，我希望这可能会有帮助！
要像我所尝试的那样做到这一点，在很大程度上取决于你正在使用的相机。我用的是rg-ip01相机。有些相机将使用不同的协议和技术。所以我安装了摄像头并访问了它的IP地址。我检查了网页(在Chrome上)，并开始寻找一些线索。有些视图使用ActiveX或Internet，但移动视图没有，其HTML是这样的：
<img name="main" id="main" border="0" width="640" height="480" src="http://192.168.1.109:8080/videostream.cgi?loginuse=admin&loginpas=">我把它插入到我的HTML中，它在Chrome上运行得很好！将IP更改为相机的IP，并检查是否有任何密码定义(如果有，请将其添加到链接中的字段中，并检查用户！)
我相信这可能会因人而异，但是他们中的很多人使用的软件都是一样的，所以也许它能工作！
谢谢伊戈尔！
Stack Overflow用户
发布于 2019-08-09 06:30:54
我使用了来自RTSP URL的Node节点RTSP流。
Stream = require('node-rtsp-stream')
stream = new Stream({
name: 'name',
streamUrl: 'rtsp://username:password@IP Address/h265/ch1/main/av_stream',
wsPort: 9999,
ffmpegOptions: { // options ffmpeg flags
'-stats': '', // an option with no neccessary value uses a blank string
'-r': 30 // options with required values specify the value after the key
}
})https://www.npmjs.com/package/node-rtsp-stream
并通过以下方式在系统中安装FFmpeg
sudo apt-get install ffmpeg上面的代码位于后端，也在前端或视图部分，我们输入了一个简单的index.html文件。
<!DOCTYPE html>
<html>
<head>
<title>JSMpeg Stream Client</title>
<style type="text/css">
html, body {
background-color: #111;
text-align: center;
}
</style>
</head>
<body>
<canvas id="video-canvas"></canvas>
<script type="text/javascript" src="jsmpeg.min.js"></script>
<script type="text/javascript">
var canvas = document.getElementById('video-canvas');
console.log(document.location.hostname);
var url = 'ws://localhost:9999/';
var player = new JSMpeg.Player(url, {canvas: canvas});
</script>
</body>
</html> 然后，文件被加载，浏览器，我们可以得到实时流光
Stack Overflow用户
发布于 2019-01-07 12:49:00
我已经在Github上发布了一个项目，帮助您将ip/网络摄像头实时传输到不需要插件的web浏览器上，这是我在MIT许可下为开源项目所作的贡献，如果您需要的话，这个项目可能与您的需要相匹配：
目前还没有完整的框架包，但这是一个启动，可能会给您提供一个进一步的方法。
作为一名学生，我希望这有帮助，并请为这个项目作出贡献。
https://stackoverflow.com/questions/46859093
复制相似问题
腾讯云开发者
