NestJS WebSocket Gateway

import {
  WebSocketGateway,
  WebSocketServer,
  SubscribeMessage,
  OnGatewayConnection,
  OnGatewayDisconnect,
} from '@nestjs/websockets';
import { Server, Socket } from 'socket.io';

@WebSocketGateway()
export class ChatGateway implements OnGatewayConnection, OnGatewayDisconnect {
  @WebSocketServer()
  server: Server;

  handleConnection(client: Socket) {
    console.log(`클라이언트 연결: ${client.id}`);
  }

  handleDisconnect(client: Socket) {
    console.log(`클라이언트 연결 해제: ${client.id}`);
  }

  @SubscribeMessage('message')
  handleMessage(client: Socket, payload: { text: string }) {
    // 모든 클라이언트에게 브로드캐스트
    this.server.emit('message', {
      userId: client.id,
      text: payload.text,
      timestamp: new Date(),
    });
  }
}

@WebSocketGateway({
  cors: {
    origin: 'https://my-app.com',
  },
  path: '/chat',
  namespace: '/live',
})

@WebSocketServer()
server: Server;

// 전체 브로드캐스트
this.server.emit('event', data);

// 특정 room에만
this.server.to('room-1').emit('event', data);

@SubscribeMessage('message')
handleMessage(client: Socket, payload: any) {
  return { event: 'response', data: 'received' };
}

interface OnGatewayConnection {
  handleConnection(client: Socket, ...args: any[]): void;
}

interface OnGatewayDisconnect {
  handleDisconnect(client: Socket): void;
}

interface OnGatewayInit {
  afterInit(server: Server): void;
}

async handleConnection(client: Socket) {
  const userCount = this.server.engine.clientsCount;

  // 최대 접속자 초과 시 연결 거부
  if (userCount > MAX_CLIENTS) {
    client.emit('error', { message: '서버가 꽉 찼습니다' });
    client.disconnect(true);
    return;
  }

  // 채팅 히스토리 전송
  const history = await this.chatService.getChatHistory();
  client.emit('chatHistory', history);

  // 접속자 수 브로드캐스트
  this.server.emit('updateUserCount', { userCount });
}

// Socket.IO (기본)
import { IoAdapter } from '@nestjs/platform-socket.io';
app.useWebSocketAdapter(new IoAdapter(app));

// ws 라이브러리
import { WsAdapter } from '@nestjs/platform-ws';
app.useWebSocketAdapter(new WsAdapter(app));

// 채팅용 Gateway
@WebSocketGateway({ namespace: '/chat' })
export class ChatGateway { ... }

// 알림용 Gateway
@WebSocketGateway({ namespace: '/notification' })
export class NotificationGateway { ... }

const chatSocket = io('http://localhost:3000/chat');
const notiSocket = io('http://localhost:3000/notification');

// 클라이언트를 room에 참가시킴
client.join('room-123');

// 해당 room에만 메시지 전송
this.server.to('room-123').emit('message', data);

// room에서 퇴장
client.leave('room-123');

// 특정 room에 있는 클라이언트 수 확인
const clients = await this.server.in('room-123').fetchSockets();
console.log(clients.length);

import { Module } from '@nestjs/common';
import { ChatGateway } from './chat.gateway';
import { ChatService } from './chat.service';

@Module({
  providers: [ChatGateway, ChatService],
})
export class ChatModule {}

@WebSocketGateway()
@UseGuards(WsAuthGuard)
@UseInterceptors(LoggingInterceptor)
export class ChatGateway {

  @SubscribeMessage('message')
  @UsePipes(new ValidationPipe())
  handleMessage(client: Socket, payload: CreateMessageDto) {
    // payload가 DTO로 검증됨
  }
}

@Injectable()
export class WsAuthGuard implements CanActivate {
  canActivate(context: ExecutionContext): boolean {
    const client = context.switchToWs().getClient<Socket>();
    const token = client.handshake.auth?.token;
    // 토큰 검증 로직
    return !!token;
  }
}

// 클라이언트
const socket = io('http://localhost:3000', {
  auth: {
    token: 'jwt-token-here',
  },
});

import { WsException } from '@nestjs/websockets';

@SubscribeMessage('message')
handleMessage(client: Socket, payload: any) {
  if (!payload.text) {
    throw new WsException('메시지 내용이 비어있습니다');
  }
  // ...
}

socket.on('exception', (error) => {
  console.log(error.message); // '메시지 내용이 비어있습니다'
});

@Catch(WsException)
export class WsExceptionFilter implements ExceptionFilter {
  catch(exception: WsException, host: ArgumentsHost) {
    const client = host.switchToWs().getClient<Socket>();
    client.emit('error', {
      status: 'error',
      message: exception.message,
    });
  }
}

@WebSocketGateway()
export class ChatGateway implements OnGatewayConnection, OnGatewayDisconnect {
  constructor(
    @InjectMetric('chat_user_count')
    private readonly userCount: Gauge,
    @InjectMetric('chat_message_count')
    private readonly messageCount: Counter,
  ) {}

  handleConnection() {
    this.userCount.inc({ room: 'anonymous' });
  }

  handleDisconnect() {
    this.userCount.dec({ room: 'anonymous' });
  }

  @SubscribeMessage('message')
  handleMessage(client: Socket, payload: any) {
    this.messageCount.inc({ room: 'anonymous' });
    // ...
  }
}

import { io } from 'socket.io-client';

const socket = io('http://localhost:3000', {
  path: '/chat',
  auth: { token: 'my-jwt' },
  transports: ['websocket'],
});

// 연결 이벤트
socket.on('connect', () => {
  console.log('연결됨:', socket.id);
});

// 메시지 수신
socket.on('message', (data) => {
  console.log('메시지:', data);
});

// 메시지 발신
socket.emit('message', { text: '안녕하세요' });

// 연결 해제
socket.on('disconnect', (reason) => {
  console.log('연결 해제:', reason);
});