利用 ffmpeg+node.js+websocket+flv.js 实现

前提：需要确认你的服务器环境中是否安装了ffmpeg这个工具，因为转码的核心其实就是通过 ffmpeg命令 转码，需要你通过在命令行里输入 ffmpeg 来确认。

一、node服务搭建

参考node版本： v14.20.0

node搭建转码服务器

const ffmpeg = require('fluent-ffmpeg');
const express = require('express');
const webSocketStream = require('websocket-stream/stream');
const expressWebSocket = require('express-ws');
ffmpeg.setFfmpegPath(ffmpegPath.path);
 
// ffmpeg.setFfmpegPath("D:/ffmpeg/bin/ffmpeg"); //设置指定目录
/**

* 创建一个后端服务

*/

function createServer() {
const app = express();
app.use(express.static(__dirname));
expressWebSocket(app, null, {
perMessageDeflate: true
});
app.ws('/rtsp/:id/', rtspToFlvHandle);

app.get('/', (req, response) => {
response.send('当你看到这个页面的时候说明rtsp流媒体服务正常启动中......');
});

  


app.listen(8100, () => {
console.log('转换rtsp流媒体服务启动了，服务端口号为8100');
});
}

/**

* rtsp 转换 flv 的处理函数
* @param ws
* @param req
*/

function rtspToFlvHandle(ws, req) {

const stream = webSocketStream(ws, {
binary: true,
browserBufferTimeout: 1000000
}, {
browserBufferTimeout: 1000000
});

console.log('req.query.url',req.query.url);

// const url = req.query.url;
const url = new Buffer.from(req.query.url, 'base64').toString(); // 前端对rtsp url进行了base64编码，此处进行解码

// console.log('rtsp url:', url);

try {
console.log('进来了');
const ffmpegCommand = ffmpeg(url)
.addInputOption(
'-rtsp_transport', 'tcp',
'-buffer_size', '102400'
)

//.addInputOption('-analyzeduration', '100000', '-max_delay', '1000000')
.on('start', (commandLine) => {
// commandLine 是完整的ffmpeg命令
console.log(commandLine, '转码 开始');
})
.on('codecData', function (data) {
console.log(data, '转码中......');
})

.on('progress', function (progress) {
// console.log(progress,'转码进度')
})

.on('error', function (err, a, b) {
console.log(url, '转码 错误: ', err.message);
console.log('输入错误', a);
console.log('输出错误', b);
stream.end();

})

.on('end', function () {
console.log(url, '转码 结束!');
})

.addOutputOption(
'-threads', '4', // 一些降低延迟的配置参数
'-tune', 'zerolatency',
'-preset', 'ultrafast'
)

.outputFormat('flv') // 转换为flv格式
.videoCodec('libx264') // ffmpeg无法直接将h265转换为flv的，故需要先将h265转换为h264，然后再转换为flv
.withSize('50%') // 转换之后的视频分辨率原来的50%, 如果转换出来的视频仍然延迟高，可按照文档上面的描述，自行降低分辨率
.noAudio() // 去除声音
.pipe(stream);

  


// stream.on('close', function () {
// ffmpegCommand.kill('SIGKILL')
// })

} catch (error) {
console.log('抛出异常', error);
}
}

createServer();

二、vue代码，使用flv播放

<div class="wrap">
<video class="video" muted autoplay controls ref="player"></video>
</div>
</template>

<script>
import flvjs from "flv.js"; // 引入flvjs
export default {
data() {
return {
player: null,
id: "1" // websokect的通信id（自己定义一个，一个地址对应一个id）
};
},

mounted() {
// 如果浏览器支持flvjs，则执行相应的程序
if (flvjs.isSupported()) {
// 准备监控设备流地址
//const url = 'rtsp://admin:1234567@192.168.1.100:554/Streaming/Channels/101?transportmode=unicast'
const url =
"rtsp://admin:htkj@85291219@192.168.19.161:554/Streaming/Channels/201?transportmode=unicast";

// 创建一个flvjs实例
// 下面的ws://localhost:8888换成你搭建的websocket服务地址，后面加上设备流地址
this.player = flvjs.createPlayer(
{
type: "flv",
isLive: true,
url: `ws://localhost:8100/rtsp/${this.id}/?url=${window.btoa(url)}`
},

{
enableStashBuffer: false, // 是否启用IO暂存缓冲区： 使用直播功能时，设置false可减少延迟，并减少网络不稳定时出现画面停顿的情况。
fixAudioTimestampGap: false, // 检测到音视频不同步时，是否填充无声音频：
isLive: true /// 是否为直播流：
}
);

/*
"videoUrl": "ws://172.20.0.188:8998/streamWs" //streamWs是通过nginx进行代理

//nginx配置
server {
        listen       8998;
        server_name  localhost;
        location /streamWs/ {
            proxy_pass http://172.20.0.34:8100/;
            proxy_set_header Host $host;
            proxy_set_header X-Real-IP $remote_addr;
            proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
            proxy_http_version 1.1;
            proxy_set_header Upgrade $http_upgrade;
            proxy_set_header Connection $connection_upgrade;

        }
    }

*/

this.player.on("error", e => {
console.log(e);
});

// 将实例挂载到video元素上面

this.player.attachMediaElement(this.$refs.player);

  


try {

// 开始运行加载 只要流地址正常 就可以在h5页面中播放出画面了
this.player.load();
this.player.play().then(() => {
//this.loading = false  // 加载成功
});

} catch (error) {
console.log(error);
}
}
},

beforeDestroy() {

// 页面销毁前 关闭flvjs

this.player.destroy();

}

};
</script>


<style scoped>
.video {
width: 500px;
height: 500px;
}

</style>

三、rstp转流服务打包出可执行文件（按需） 

node打包可执行文件工具——Pkg 参考：wjhsh.net/cangqinglan…