本文主要介绍下利用Opencv获取摄像头视频数据，并结合ffmpeg推流到流服务器，并在前端页面中显示的整个思路与实现。

1.整体结构

screenviewer服务内部结构分布：

2.方案分析

整体方案如第二部分所示，主要由四部分组成：硬件视频采集设备、视频捕捉模块、流媒体服务、流媒体播放器。涉及的功能技术点有三块：a.实时视频采集与推送；b.rtmp流服务器的搭建；c.流媒体播放器的选择。

a.实时视频采集与推送

采用OpenCV开源视觉库结合FFmpeg进行开发，主要代码片段如下：

初始化采集设备：

if(!m_isCameraData)
{
    qDebug()<< "m_inputSrc: " << m_inputSrc;
    m_cam.open(m_inputSrc.toStdString().data());
}else{
    qDebug()<< "m_videoIndex: " << m_videoIndex;
    m_cam.open(m_videoIndex);
}
 
if (!m_cam.isOpened())
{
    qDebug()<< "camera open failed";
    ret = false;
    return ret;
}
 
// 获取图像属性
m_inWidth = m_cam.get(cv::CAP_PROP_FRAME_WIDTH);
m_inHeight = m_cam.get(cv::CAP_PROP_FRAME_HEIGHT);
m_fps = m_cam.get(cv::CAP_PROP_FPS);

ffmpeg相关初始化：

int VideoWorker::initPushVideo()
{
    int code = 0;
 
    bool ret = false;
 
    // 2.初始化格式转换上下文
    ret = initSwsContext();
    if (!ret)
    {
        qWarning("初始化格式转换上下文失败");
        code = 2;
        return code;
    }
 
    // 3.初始化输出的数据结构
    ret = initOutYuv();
    if (!ret)
    {
        qWarning("初始化输出YUV失败");
        code = 3;
        return code;
    }
 
    // 4.初始化编码上下文
    ret = initVideoCodeC();
    if (!ret)
    {
        qWarning("初始化编码上下文失败");
        code = 4;
        return code;
    }
 
    // 输出封装器和视频流配置
    ret = initOutCAndVideoCfg();
    if (!ret)
    {
        qWarning("输出封装器和视频流配置失败");
        code = 5;
        return code;
    }
 
    return code;
}

各个部分的初始化：

int VideoWorker::initPushVideo()
{
    int code = 0;
 
    bool ret = false;
 
    // 2.初始化格式转换上下文
    ret = initSwsContext();
    if (!ret)
    {
        qWarning("初始化格式转换上下文失败");
        code = 2;
        return code;
    }
 
    // 3.初始化输出的数据结构
    ret = initOutYuv();
    if (!ret)
    {
        qWarning("初始化输出YUV失败");
        code = 3;
        return code;
    }
 
    // 4.初始化编码上下文
    ret = initVideoCodeC();
    if (!ret)
    {
        qWarning("初始化编码上下文失败");
        code = 4;
        return code;
    }
 
    // 输出封装器和视频流配置
    ret = initOutCAndVideoCfg();
    if (!ret)
    {
        qWarning("输出封装器和视频流配置失败");
        code = 5;
        return code;
    }
 
    return code;
}

工作线程：

void VideoWorker::doVideoWork()
{
    bool ret = true;
    while(m_isDoWork)
    {
        // 连续100帧图像未采集到，则认为结束，通知主线程结束任务
        if(m_noframeCount>=100)
        {
            // 通知停止工作
            emit workOver();
        }
        /*读取rtsp视频下一帧，解码视频帧*/
        if (!m_cam.grab())
        {
            m_noframeCount++;
            continue;
        }
        /*yuv转换为rgb*/
        if (!m_cam.retrieve(m_frame))
        {
            continue;
        }
 
        // 采集到图像则计数器清零
        m_noframeCount= 0;
        if(m_isSaveFile)
        {
            m_writer << m_frame;
        }
        if(m_isGray)
        {
            cv::Mat gray;
            cv::cvtColor(m_frame, gray, cv::COLOR_BGR2GRAY);
            emit imageGetted(matToPixmap(gray));
        }else
        {
            emit imageGetted(matToPixmap(m_frame));
        }
        cv::waitKey(m_fps);
        if(!m_isPush)
        {
            continue;
        }
        if(!m_pushCfgReady)
        {
            continue;
        }
 
        /*rgb to yuv*/
        //输入的数据结构
        uint8_t *indata[AV_NUM_DATA_POINTERS] = { 0 };
 
        indata[0] = m_frame.data;
        int insize[AV_NUM_DATA_POINTERS] = { 0 };
 
        //一行（宽）数据的字节数
        insize[0] = m_frame.cols * m_frame.elemSize();
        int h = sws_scale(m_vsc, indata, insize, 0, m_frame.rows, //源数据
                          m_yuv->data, m_yuv->linesize);
        if (h <= 0)
        {
            continue;
        }
 
        /*h264编码*/
        m_yuv->pts = m_vpts;
        m_vpts++;
 
        ret = avcodec_send_frame(m_vc, m_yuv);
        if (ret != 0)
            continue;
 
        ret = avcodec_receive_packet(m_vc, &m_pack);
        if (ret != 0 || m_pack.size > 0)
        {
            // qDebug() << "*" + m_pack.size << flush;
        }
        else
        {
            continue;
        }
 
        //推流
        m_pack.pts = av_rescale_q(m_pack.pts, m_vc->time_base, m_vs->time_base);
        m_pack.dts = av_rescale_q(m_pack.dts, m_vc->time_base, m_vs->time_base);
        m_pack.duration = av_rescale_q(m_pack.duration, m_vc->time_base, m_vs->time_base);
 
        ret = av_interleaved_write_frame(m_ic, &m_pack);
        if (ret == 0)
        {
            Q_UNUSED(ret);
        }
    }
    if(m_cam.isOpened())
    {
        m_cam.release();
    }
    destoryPointers();
}

b.rtmp流服务器的搭建

此部分有大体两个方案：Ⅰ.nginx+rtmp模块，最终会依赖浏览器的flash，现在浏览器基本都放弃了flash，所以我也放弃了这个方案；Ⅱ.nodejs的npm模块，即node-meida-server，不依赖flash，我选择了它。

下载：

npm i node-media-server --save

在node_modules同级目录下，新建app.js，写入以下内容：

/*
 * @Descripttion: 
 * @version: 
 * @Author: zhen
 * @Date: 2022-08-23 21:53:54
 * @LastEditors: 
 * @LastEditTime: 2022-08-23 21:54:01
 */
const NodeMediaServer = require('node-media-server');
 
const config = {
  rtmp: {
    port: 1935,
    chunk_size: 60000,
    gop_cache: true,
    ping: 30,
    ping_timeout: 60
  },
  http: {
    port: 8000,
    allow_origin: '*'
  }
};
 
var nms = new NodeMediaServer(config)
nms.run();

启动：