I am working on a project that involves a React client using Socket.io for real-time communication with a Node.js server. The server handles code blocks, and each code block has its own room to manage collaborative editing.
am encountering an issue where, upon emitting events to rooms, I receive a “session id unknown” error. This error seems to indicate a problem with identifying the session associated with a particular socket.
This is my server side:
const express = require("express");
const http = require("http");
const { Server } = require("socket.io");
const cors = require("cors");
const connectDB = require('./configs/db');
const codeBlockRouter = require('./routers/codeBlockRouter');
const users = require('./routers/userRouter')
const app = express();
app.use(cors());
app.use(express.json())
// routers
app.use('/codeblocks', codeBlockRouter)
app.use('/users', users)
connectDB();
const server = http.createServer(app);
const io = new Server(server, {
cors: {
origin: "https://online-coding-web-client.vercel.app",//client
methods: ["GET", "POST"],
credentials: true,
},
});
let userCount = 0;
io.on("connection", (socket) => {
const user = `${++userCount}`;
console.log(`User connected: user${user}`);
socket.emit("user_connected", { user });
socket.on("join_room", (data) => {
console.log(`User joined room: ${data}`);
socket.join(data);
});
socket.on("send_message", (data) => {
console.log(`Received message: ${data.messageText} from user ${data.user}`);
socket.broadcast.emit("receive_message", { ...data, user });
});
socket.on("disconnect", () => {
console.log(`User disconnected: user${user}`);
});
});
server.listen(5000, () => {
console.log("SERVER IS RUNNING");
});
This is my client side:
import io from 'socket.io-client'
const socket = io(serverURL, {
withCredentials: true
})
useEffect(() => {
socket.emit("join_room", codeBlockId);
}, [codeBlockId]);
useEffect(() => {
socket.on("user_connected", (data) => {
setUser(data.user);
});
}, [socket]);
useEffect(() => {
socket.on("receive_message", (data) => {
setText(data.messageText);
});
}, [socket]);
useEffect(() => {
return () => {
socket.disconnect();
};
}, []);
const sendMessage = (messageText) => {
socket.emit("send_message", { messageText, user });
};
I suspect that the issue may be related to how I am handling socket connections, disconnections, or room management. Could someone please review the provided code snippets and help me identify what might be causing the “session id unknown” error?