nodejs调用ffmpeg录屏推流到websocket地址，网页端调用mpegts.js播放视频流.
执行步骤：
1, node server.js
2, 浏览器打开test.html
server.js
const { spawn } = require('child_process');
const WebSocket = require('ws');
const express = require('express');
const http = require('http');
// 创建 WebSocket 服务器
//const wss = new WebSocket.Server({ port: 8080 });
const app = express();
const server = http.createServer(app);
const wss = new WebSocket.Server({ server });
wss.on('connection', (ws) => {
console.log('Client connected');
// 启动 FFmpeg 进程
const ffmpeg = spawn('ffmpeg', [
//'-rtsp_transport', 'udp', // 使用 TCP 传输 RTSP 流（如果 UDP 不稳定）
//'-f', 'x11grab', linux
'-f', 'gdigrab',
//'-s', '1920x1080', // 分辨率 linux
//'-i', ':0.0+0,00', //linux
'-i', 'desktop', //
'-f', 'mpegts', // 输出格式为 MPEG-TS
'-c:v', 'libx264', // 使用 MPEG-1 编码
'-s', '1920x1080', // 分辨率
'-preset', 'ultrafast',
'-tune', 'zerolatency',
//'-b:v', '800k', // 视频比特率
'-bf', '0', // 禁用 B 帧
'-an', // 禁用音频
'pipe:1' // 输出到标准输出
]);
// 将 FFmpeg 的输出发送到 WebSocket 客户端
ffmpeg.stdout.on('data', (data) => {
if (ws.readyState === ws.OPEN) {
ws.send(data); // 发送二进制数据
}
});
// 处理 FFmpeg 的错误输出
ffmpeg.stderr.on('data', (data) => {
console.error(`FFmpeg error: ${data}`);
});
// 处理 FFmpeg 进程退出
ffmpeg.on('close', (code) => {
console.log(`FFmpeg process exited with code ${code}`);
});
// 客户端断开连接时关闭 FFmpeg 进程
ws.on('close', () => {
console.log('Client disconnected');
ffmpeg.kill(); // 杀死 FFmpeg 进程
});
});
server.listen(80, () => {
console.log('HTTP & WebSocket server is running on ws://localhost:80');
}
);
test.html
<!DOCTYPE html>
<html>
<head>
<title>H264流播放</title>
<script src="mpegts.js"></script>
</head>
<body>
<video id="videoPlayer" controls autoplay muted style="width: 100%; max-width: 1280px;"></video>
<script>
const videoDom = document.getElementById('videoPlayer');
if (mpegts.getFeatureList().mseLivePlayback) {
const player = mpegts.createPlayer({
type: 'mpegts', // 告知解码器这是 MPEG2-TS 格式citation:10
isLive: true, // 开启实时流模式
url: 'ws://127.0.0.1:80' // 需保持与FFmpeg推送地址一致
},{
liveBufferLatencyChasing: true,
liveBufferLatencyMaxLatency: 1.5,
liveBufferLatencyMinRemain: 0.5
}
);
player.attachMediaElement(videoDom);
player.load();
player.play();
} else {
console.error("当前浏览器不支持mpegts.js解码");
}
</script>
</body>
</html>