海康威视视频转发：Ffmpeg+Node.js+jsmpeg Docker部署

因公司有web页面嵌入海康威视视频流的需求，在海康监控管理端看到有RTSP服务，网上查，可以用Ffmpeg+jsmpeg把RTSP转成Web可播放的hls。

准备材料：

下载jsmpeg

备用下载链接：

jsmpeg-master.zip

将下载好的jsmpeg-master.zip解压缩放到Linux指定目录，如：/home/cyy/video

接下来在video目录里，新建dockerfile

FROM node:14.16.1

 # 将此dockerfile根目录下的文件都copy到container（运行此镜像的容器）文件系统的video文件夹下
 ADD . /video
 # cd到video文件夹下
 WORKDIR /video
 # 容器对外暴露的端口号
 EXPOSE 8075 8076
 # 容器启动时执行的命令
 CMD node jsmpeg-master/websocket-relay.js supersecret 8075 8076

执行如下脚本创建镜像

docker build -t jsmpeg .

执行如下脚本创建容器

docker run -itd --name jsmpeg -p 8075:8075 -p 8076:8076 jsmpeg

---

Ffmpeg配置

执行如下命令拉取镜像

docker pull jrottenberg/ffmpeg

执行如下脚本创建容器

docker run -it --name ffmpeg -p 8077:8080 --entrypoint='bash' jrottenberg/ffmpeg

创建容器后，会自动进入容器内，再执行如下脚本

ffmpeg -rtsp_transport tcp -i rtsp://摄像头的账号(一般是admin):摄像头的密码@摄像头的IP地址:端口/h264/ch1/main/av_stream -q 0 -f mpegts -codec:v mpeg1video -s 655x460 http://部署有jsmpeg的IP地址:8075/supersecret

之后按“Ctrl+P+Q”按钮退出容器

到此，再试试web端

下载：jsmpeg.min.js

/**
 * 异步加载第三方js的工具
 */

class loadJSUtils {
    /**
     * @param jsSrc js的路径
     */
    public loadJs(jsSrc: any): Promise<any> {
        return new Promise((resolve, reject) => {
            let script = document.createElement('script')
            script.type = 'text/javascript'
            script.async = false
            script.src = jsSrc

            script.onload = () => {
                resolve("ok");
            }
            script.onerror = () => {
                reject();
            }
            script.onload = function () {
                resolve("ok");
            };
            document.head.appendChild(script)
        })
    }
}

export const loadJsUtil = new loadJSUtils();

业务代码（我用的vue）：

        const loadAllJs = async () => {
            await loadJsUtil.loadJs("/libs/jsmpeg.min.js").then(() => {
                // let url = process.env.VUE_APP_VIDEO;
                let url = 'ws://xx.xx.xx.xx:8076'; // 部署有jsmpeg的服务器IP
                var canvasHtml = document.getElementById('video-canvas');
                var player = new JSMpeg.Player(url, {canvas: canvasHtml});
            });
        }

完成！！

参考了：

https://blog.csdn.net/wtnu200/article/details/123875611

https://blog.csdn.net/a843334549/article/details/120697574