背景

物联网时代，作为开发，基本上都需要在系统中调取摄像头的实时视频，不懂的时候觉得挺复杂了，但是弄的久之后发现有很多比较好的方法，可以实现在系统中打开摄像头实时视频更加快速和流畅。在此之前我经历了几个阶段： 1.第一个阶段是使用rtmp转rtsp的方式，通过nginx的一个模块加上ffmpeg去进行视频的播放，其中存在一个问题rtsp在浏览器中播放时需要flash插件的支持，不然播放不了（且打开比较慢），虽然有时会出现问题，但是一直这样也用了很久，在给客户部署的时候也发现比较麻烦，所以有了第二个阶段。 2.第二阶段我发现客户的摄像头版本比较新，可以支持websocket的播放，这种方式基本不用部署nginx的模块和ffmpeg,直接使用海康摄像头的api就可以在浏览器播放实时视频了，这个阶段的方案如下【方案一】所示。 3.接下来到了阶段三，为什么有阶段三呢，是因为websocket播放摄像头实时视频虽好，但是客户还是有大部分摄像头不支持websocket的方式，于是又发现了一种新的技术，旧的的摄像头也可以通过自己写websocket服务端的方式实现，技术是ffmpeg+websocket+jsmpeg+java的方式实现，这个方式主要是参考： https://blog.csdn.net/qq_36304149/article/details/114983991?utm_source=app&app_version=5.5.0&code=app_1562916241&uLinkId=usr1mkqgl919blen 这个方法实现容易，经过多次测试，没有发现大的问题，视频可以连续播放超过一晚上，可以任意根据websocket客户端连接进行视频流的推送，可以多个电脑同时打开多个不同的视频，基本都没什么问题。

其中jsmpeg可以直接在官网进行下载。 websocket客户端连接地址：

var player = new JSMpeg.Player('ws://192.166.11.136:9102/aa/rtsp?param=10ebce7e-52f6-4c36-8ac4-31fc22bbb850_7', { canvas: document.getElementById('video'), decodeFirstFrame: true, disableWebAssembly: false, throttled: false, //这里设置为false，不然不触发onSourceCompleted事件 chunkSize: 4 * 1024 * 1024, disableGl: false, audio: true, autoplay:true, loop:false, onSourceCompleted:()=>{ }

10ebce7e-52f6-4c36-8ac4-31fc22bbb850_7是UUID加摄像头ID 该参数可以在打开视频的时候调用后台接口生成这样一个会话ID.

ffmepg推流地址：

ffmpeg -rtsp_transport tcp -i "rtsp://admin:password@ip:554/Streaming/Channels/101?transportmode=unicast" -q 0 -f mpegts -codec:v mpeg1video -s 700x400 http://192.166.11.136:9120/aa/rtsp?query=7

其中query=7表示这是摄像头id为7的视频流，通过ffmpeg进行推送的，服务端只需要写一个接口地址进行取流推送即可。

坑1

ffmpeg推送几分钟就中断了（不要取怀疑ffmpeg的问题还是接口超时等问题，其实就是取流的问题），参考： https://blog.csdn.net/qq_40351360/article/details/125284210

注意，最好不要用这个方案！！！！！！！！！！，发现存在问题，浏览器容易内存异常，这个错误不好解决！！2022-11-30 方案一

https://blog.csdn.net/qq_40351360/article/details/124894387?spm=1001.2014.3001.5502

---

1.本站遵循行业规范，任何转载的稿件都会明确标注作者和来源；2.本站的原创文章，会注明原创字样,如未注明都非原创，如有侵权请联系删除！；3.作者投稿可能会经我们编辑修改或补充；4.本站不提供任何储存功能只提供收集或者投稿人的网盘链接。