Files
spotlightcam/backend/src/socket/index.js

271 lines
7.8 KiB
JavaScript
Raw Normal View History

feat: implement real-time chat with Socket.IO Implemented WebSocket-based real-time messaging for both event rooms and private match chats using Socket.IO with comprehensive test coverage. Backend changes: - Installed socket.io@4.8.1 for WebSocket server - Created Socket.IO server with JWT authentication middleware - Implemented event room management (join/leave/messages) - Added active users tracking with real-time updates - Implemented private match room messaging - Integrated Socket.IO with Express HTTP server - Messages are persisted to PostgreSQL via Prisma - Added 12 comprehensive unit tests (89.13% coverage) Frontend changes: - Installed socket.io-client for WebSocket connections - Created socket service layer for connection management - Updated EventChatPage with real-time messaging - Updated MatchChatPage with real-time private chat - Added connection status indicators (● Connected/Disconnected) - Disabled message input when not connected Infrastructure: - Updated nginx config to proxy WebSocket connections at /socket.io - Added Upgrade and Connection headers for WebSocket support - Set long timeouts (7d) for persistent WebSocket connections Key features: - JWT-authenticated socket connections - Room-based architecture for events and matches - Real-time message broadcasting - Active users list with automatic updates - Automatic cleanup on disconnect - Message persistence in database Test coverage: - 12 tests passing (authentication, event rooms, match rooms, disconnect, errors) - Socket.IO module: 89.13% statements, 81.81% branches, 91.66% functions - Overall coverage: 81.19% Phase 1, Step 4 completed. Ready for Phase 2 (Core Features).
2025-11-12 22:42:15 +01:00
const { Server } = require('socket.io');
const { verifyToken } = require('../utils/auth');
const { prisma } = require('../utils/db');
// Track active users in each event room
const activeUsers = new Map(); // eventId -> Set of { socketId, userId, username, avatar }
function initializeSocket(httpServer) {
const io = new Server(httpServer, {
cors: {
origin: process.env.CORS_ORIGIN || 'http://localhost:8080',
credentials: true,
},
});
// Authentication middleware for Socket.IO
io.use(async (socket, next) => {
try {
const token = socket.handshake.auth.token;
if (!token) {
return next(new Error('Authentication required'));
}
const decoded = verifyToken(token);
if (!decoded) {
return next(new Error('Invalid token'));
}
// Get user from database
const user = await prisma.user.findUnique({
where: { id: decoded.userId },
select: {
id: true,
username: true,
email: true,
avatar: true,
},
});
if (!user) {
return next(new Error('User not found'));
}
socket.user = user;
next();
} catch (error) {
console.error('Socket auth error:', error);
next(new Error('Authentication failed'));
}
});
io.on('connection', (socket) => {
console.log(`✅ User connected: ${socket.user.username} (${socket.id})`);
// Join event room
socket.on('join_event_room', async ({ eventId }) => {
try {
const roomName = `event_${eventId}`;
socket.join(roomName);
socket.currentEventRoom = roomName;
socket.currentEventId = eventId;
// Add user to active users
if (!activeUsers.has(eventId)) {
activeUsers.set(eventId, new Set());
}
const userInfo = {
socketId: socket.id,
userId: socket.user.id,
username: socket.user.username,
avatar: socket.user.avatar,
};
activeUsers.get(eventId).add(JSON.stringify(userInfo));
console.log(`👤 ${socket.user.username} joined event room ${eventId}`);
// Broadcast updated active users list
const users = Array.from(activeUsers.get(eventId)).map(u => JSON.parse(u));
io.to(roomName).emit('active_users', users);
// Notify room about new user
socket.to(roomName).emit('user_joined', {
userId: socket.user.id,
username: socket.user.username,
avatar: socket.user.avatar,
});
} catch (error) {
console.error('Join event room error:', error);
socket.emit('error', { message: 'Failed to join room' });
}
});
// Leave event room
socket.on('leave_event_room', ({ eventId }) => {
const roomName = `event_${eventId}`;
socket.leave(roomName);
// Remove from active users
if (activeUsers.has(eventId)) {
const users = activeUsers.get(eventId);
const userInfo = JSON.stringify({
socketId: socket.id,
userId: socket.user.id,
username: socket.user.username,
avatar: socket.user.avatar,
});
users.delete(userInfo);
// Broadcast updated list
const updatedUsers = Array.from(users).map(u => JSON.parse(u));
io.to(roomName).emit('active_users', updatedUsers);
}
console.log(`👤 ${socket.user.username} left event room ${eventId}`);
});
// Send message to event room
socket.on('send_event_message', async ({ eventId, content }) => {
try {
const roomName = `event_${eventId}`;
// Save message to database
const chatRoom = await prisma.chatRoom.findFirst({
where: {
eventId: parseInt(eventId),
type: 'event',
},
});
if (!chatRoom) {
return socket.emit('error', { message: 'Chat room not found' });
}
const message = await prisma.message.create({
data: {
roomId: chatRoom.id,
userId: socket.user.id,
content,
type: 'text',
},
include: {
user: {
select: {
id: true,
username: true,
avatar: true,
},
},
},
});
// Broadcast message to room
io.to(roomName).emit('event_message', {
id: message.id,
roomId: message.roomId,
userId: message.user.id,
username: message.user.username,
avatar: message.user.avatar,
content: message.content,
type: message.type,
createdAt: message.createdAt,
});
console.log(`💬 Message in event ${eventId} from ${socket.user.username}`);
} catch (error) {
console.error('Send message error:', error);
socket.emit('error', { message: 'Failed to send message' });
}
});
// Join private match room
socket.on('join_match_room', ({ matchId }) => {
const roomName = `match_${matchId}`;
socket.join(roomName);
socket.currentMatchRoom = roomName;
console.log(`👥 ${socket.user.username} joined match room ${matchId}`);
});
// Send message to match room
socket.on('send_match_message', async ({ matchId, content }) => {
try {
const roomName = `match_${matchId}`;
// Get match and its room
const match = await prisma.match.findUnique({
where: { id: parseInt(matchId) },
include: { room: true },
});
if (!match || !match.room) {
return socket.emit('error', { message: 'Match room not found' });
}
// Save message
const message = await prisma.message.create({
data: {
roomId: match.room.id,
userId: socket.user.id,
content,
type: 'text',
},
include: {
user: {
select: {
id: true,
username: true,
avatar: true,
},
},
},
});
// Broadcast to match room
io.to(roomName).emit('match_message', {
id: message.id,
roomId: message.roomId,
userId: message.user.id,
username: message.user.username,
avatar: message.user.avatar,
content: message.content,
type: message.type,
createdAt: message.createdAt,
});
console.log(`💬 Private message in match ${matchId} from ${socket.user.username}`);
} catch (error) {
console.error('Send match message error:', error);
socket.emit('error', { message: 'Failed to send message' });
}
});
// Handle disconnection
socket.on('disconnect', () => {
console.log(`❌ User disconnected: ${socket.user.username} (${socket.id})`);
// Remove from active users in all event rooms
if (socket.currentEventId) {
const eventId = socket.currentEventId;
if (activeUsers.has(eventId)) {
const users = activeUsers.get(eventId);
const userInfo = JSON.stringify({
socketId: socket.id,
userId: socket.user.id,
username: socket.user.username,
avatar: socket.user.avatar,
});
users.delete(userInfo);
// Broadcast updated list
const updatedUsers = Array.from(users).map(u => JSON.parse(u));
io.to(socket.currentEventRoom).emit('active_users', updatedUsers);
// Notify about user leaving
socket.to(socket.currentEventRoom).emit('user_left', {
userId: socket.user.id,
username: socket.user.username,
});
}
}
});
});
console.log('🔌 Socket.IO initialized');
return io;
}
module.exports = { initializeSocket };