Creating a basic website where multiple users can access a specific dashboard using a unique id. When one user sends a video file, it should start streaming for other users on the same dashboard. I am implementing this functionality using Express.js, socket.io, and peerjs to enable data transfer over the WebRTC stream.
Server-side code:
// Set up the express server
const express = require('express');
const app = express();
const server = require('http').Server(app);
const io = require('socket.io')(server);
const { v4: uuidV4 } = require('uuid')
// Configure Express.js
app.set('view engine', 'ejs');
app.use(express.static('public'));
// Handle root route
app.get('/', (req, res) => {
res.redirect(`/${uuidV4()}`)
});
// Handle dashboard route
app.get('/:dashboard', (req, res) => {
res.render('dashboard', { dashboardId: req.params.dashboard })
})
// Set up Socket.io
io.on('connection', socket => {
socket.on('join', (dashboardId, userId) => {
socket.join(dashboardId)
console.log(userId)
socket.broadcast.emit('userJoined',{userId:userId})
})
})
// Start the server
const port = 3000;
server.listen(port, () => {
console.log(`Server running on port ${port}`);
});Client-side code:
const socket = io('/');
const peer = new Peer(undefined, {
host: '/',
port: '3001'
});
peer.on('open', function (id) {
const CHUNK_SIZE = 5120; // 5KB
socket.emit('join', DASHBOARD_ID,id);
socket.on('userJoined',(userId)=>{
console.log(userId)
const conn = peer.connect(userId.userId);
conn.on('open', function () {
...
});
})
});
...
The issue is that although the connection with the correct peer is established, the data chunks are not being received by the receiver peer, and the video is not streaming. This problem has been persisting even after thorough debugging efforts. Any assistance in resolving this matter would be highly appreciated.