直播中前端技术

项目中用到的技术

electron-vue
node
ffmpeg
socket.io

electron-vue

介绍：electron由Node.js+Chromium+Native APIs构成。是一个得到了Node.js和基于不同平台的Native APIs加强的Chromium浏览器，可以用来开发跨平台的桌面级应用。
应用：构建应用窗口，调用native api(main进程中)
      渲染页面，完成交互(renderer进程中)
部分代码：
function createWindow() {
    mainWindow = new BrowserWindow({
        width: 1000,
        height: 600,
        minWidth: 1000,
        minHeight: 600,
        useContentSize: true,
        // frame: false
    });


    mainWindow.webContents.openDevTools();
    mainWindow.loadURL(winURL);
    app.on("ready", createWindow);

ffmpeg

介绍：FFmpeg是一套可以用来记录、转换数字音频、视频，并能将其转化为流的开源计算机程序。它提供了录制、转换以及流化音视频的完整解决方案。它包含了非常先进的音频/视频编解码库libavcodec
应用：利用ffmpeg进行直播推流，以及对音视频进行操作
部分代码：
window查看摄像机和麦克名字:ffmpeg -list_devices true -f dshow -i dummy
将直播媒体保存至本地文件   ffmpeg -i "http://lexue-play.chatopera.com/live/47122_zhangsan_765e.flv" -c copy dump.flv
将视频每5秒保存成本地图片：ffmpeg -i a.mp4 -vf fps=1/5 thumb%04d.jpg -hide_banner
推流本地摄像头和麦克风到推流地址：ffmpeg -f dshow -i video="摄像头名" -f dshow -i audio="麦克风名" -vcodec libx264 -preset:v ultrafast -tune:v zerolatency -f flv "推流地址"

node

介绍：Node.js 是一个基于 Chrome V8 引擎的 JavaScript 运行环境。 Node.js 使用了一个事件驱动、非阻塞式 I/O 的模型，使其轻量又高效。
应用：使用node的fs构建本地配置，使用node的child-process为推流，视频操作提供实现方式
部分代码：
exec(cmdStr, function(err, stdout, stderr) {
            console.log("推流测试");
            if (err) {
              console.log("get weather api error:" + stderr);
            } else {
              console.log("推流成功");
            }
          }).pid;
        });

socket.io

介绍：网络上的两个程序通过一个双向的通信连接实现数据的交换，这个连接的一端称为一个socket。
应用：通过socket.io实时的与后端进行通信，服务器，在两客户端之间充当中间件的作用，在经过处理之后把消息返回给各端
部分代码：
       const socket = io('http://192.168.0.1:15757', {  
                query: `username= &&classid= `
            });
              //课程开始事件
            socket.on( 'server/course/start',(data)=>{
                  console.log( data,'得到后端传送的数据')
              }

最后编辑于：2019.06.14 17:37:11