HTML5实时显示摄像头视频
2017-09-29 13:58
866 查看
1、页面HTML代码:
2、需要Node做服务端,下载jsmpeg-master
http://download.csdn.net/download/wr751811032/9403310
npm install cnpm -g --registry=https://registry.npm.taobao.org
cnpm install ws -g
添加 NODE_PATH 和path 环境变量,路径是modules模块儿的所在路径,注意用户模块和全局安装模块儿的路径不同,根据需要选择,不设置服务器报错找不到模块module
node D:\lang\nodejs\node_modules\jsmpeg-master\websocket-relay.js 123456 8981 8982
ffmpeg -i rtsp://184.72.239.149/vod/mp4://BigBuckBunny_175k.mov -f mpegts -codec:v mpeg1video -bf 0 -codec:a mp2 -r 120 -q 2 http://localhost:8981/123456/640/480/
ffmpeg -i rtsp://218.204.223.237:554/live/1/66251FC11353191F/e7ooqwcfbqjoo80j.sdp -f mpegts -codec:v mpeg1video -bf 0 -codec:a mp2 -r 120 -q 2 http://localhost:8981/123456/640/480/
海康:
rtsp://[username]:[password]@[ip]:[port]/[codec]/[channel]/[subtype]/av_stream
rtsp://admin:12345@192.0.0.64:554/h264/ch1/main/av_stream
大华:
rtsp://username:password@ip:port/cam/realmonitor?channel=1&subtype=0
<canvas id="video-canvas" style="width: 100%; height: 387px;"></canvas>
<script type="text/javascript" src="<%=basePath%>resources/js/jsmpeg-master/jsmpeg.min.js"></script> <script type="text/javascript"> var canvas = document.getElementById('video-canvas'); var url = 'ws://' + document.location.hostname + ':' + port + '/'; port = port + 2; var player = new JSMpeg.Player(url, { canvas : canvas }); </script>
2、需要Node做服务端,下载jsmpeg-master
http://download.csdn.net/download/wr751811032/9403310
npm install cnpm -g --registry=https://registry.npm.taobao.org
cnpm install ws -g
添加 NODE_PATH 和path 环境变量,路径是modules模块儿的所在路径,注意用户模块和全局安装模块儿的路径不同,根据需要选择,不设置服务器报错找不到模块module
node D:\lang\nodejs\node_modules\jsmpeg-master\websocket-relay.js 123456 8981 8982
ffmpeg -i rtsp://184.72.239.149/vod/mp4://BigBuckBunny_175k.mov -f mpegts -codec:v mpeg1video -bf 0 -codec:a mp2 -r 120 -q 2 http://localhost:8981/123456/640/480/
ffmpeg -i rtsp://218.204.223.237:554/live/1/66251FC11353191F/e7ooqwcfbqjoo80j.sdp -f mpegts -codec:v mpeg1video -bf 0 -codec:a mp2 -r 120 -q 2 http://localhost:8981/123456/640/480/
海康:
rtsp://[username]:[password]@[ip]:[port]/[codec]/[channel]/[subtype]/av_stream
rtsp://admin:12345@192.0.0.64:554/h264/ch1/main/av_stream
大华:
rtsp://username:password@ip:port/cam/realmonitor?channel=1&subtype=0
相关文章推荐
- 海康威视多摄像头视频实时采集——OpenCV显示
- JAVA实现大华摄像头WEB方式实时显示视频,H5界面展示方式思路。
- 用OpenCV在MFC Dialog中Picture控件上显示摄像头采集实时视频
- 树莓派+官方摄像头模块+VLC串流实时输出网络视频流
- 海康摄像头实时显示与字符叠加详解
- 图像拼接(四):双摄像头实时视频拼接(平移模型)
- 树莓派+官方摄像头模块+VLC串流实时输出网络视频流
- HTML5 Camera(摄像头) 和 Video(视频)控制
- [置顶] 基于iOS的网络音视频实时传输系统(六)- AudioQueue播放音频,OpenGL渲染显示图像
- Android实时监控项目第三篇:通过摄像头实时预览帧视频
- Linux 下摄像头视频采集与显示
- H5实现调用本地摄像头实现实时视频以及拍照功能
- [Rtsp]RTSP对实时摄像头视频流进行转换(FFmpeg+FFserver)
- MATLAB图片,视频,摄像头的读取和显示
- 在MFC中通过opencv显示摄像头视频或者文件视频
- OpenCV 获取摄像头,新建窗口显示摄像头视频
- OpenCV 获取摄像头并显示摄像头视频
- Qt+opencv多摄像头视频显示
- 采集音频和摄像头视频并实时H264编码及AAC编码[转]
- 在MFC中通过opencv显示摄像头视频或者文件视频