[NodeJS] Socket.IO 이해하기

Socket.IO는 실시간 웹 애플리케이션 개발을 위한 라이브러리입니다. Node.js와 함께 사용할 수 있으며, 웹 소켓(WebSocket)을 기반으로 작동합니다. Socket.IO는 양방향 통신을 지원하며, 클라이언트와 서버 간의 실시간 데이터 전송을 가능하게 합니다.

Socket.IO 설치

Socket.IO 라이브러리는 다음과 같이 npm을 사용하여 설치할 수 있습니다.

npm install socket.io

Socket.IO 서버 생성

Socket.IO 라이브러리를 사용하여 Socket.IO 서버를 생성합니다.

Express 애플리케이션과 함께 사용하려면, 다음과 같이 socket.io 모듈을 사용하여 Socket.IO 서버를 생성합니다.

const socketIo = require('socket.io');
const io = socketIo(server);

Socket.IO 이벤트 핸들링
Socket.IO 서버에서 발생하는 이벤트를 핸들링합니다. 다음과 같이 io.on() 메서드를 사용하여 이벤트를 핸들링할 수 있습니다.

io.on('connection', (socket) => {
  console.log('a user connected');
  
  socket.on('disconnect', () => {
    console.log('user disconnected');
  });
  
  socket.on('chat message', (msg) => {
    console.log(`message: ${msg}`);
    io.emit('chat message', msg);
  });
});

위 코드는, io.on('connection') 이벤트를 핸들링하여, 클라이언트가 연결되었을 때 처리할 로직을 작성합니다.

socket.on() 메서드를 사용하여 클라이언트에서 발생하는 이벤트를 핸들링합니다. 클라이언트에서 socket.emit('chat message') 이벤트를 발생시켰을 때 처리할 로직을 작성하고, io.emit('chat message') 메서드를 사용하여 모든 클라이언트에게 메시지를 전송합니다.

---

emit과 on

Socket.IO 라이브러리에서 on()과 emit() 메서드는 이벤트를 핸들링하고, 발생시키는 데 사용됩니다.

emit 메서드

emit 메서드는 클라이언트나 서버에서 특정 이벤트를 발생시킬 때 사용됩니다. emit() 메서드는 다음과 같은 형식으로 사용됩니다.

socket.emit(eventName, eventData)

eventName: 이벤트 이름입니다.
eventData: 이벤트에 전달할 데이터입니다.

예를 들어, 다음과 같이 chat message 이벤트를 발생시킬 수 있습니다.

socket.emit('chat message', 'Hello, World!');

위 코드는, chat message 이벤트를 발생시켜 'Hello, World!' 데이터를 전달합니다.

---

on 메서드

on 메서드는 클라이언트나 서버에서 특정 이벤트를 수신할 때 사용됩니다. on() 메서드는 다음과 같은 형식으로 사용됩니다.

socket.on(eventName, callbackFunction)

eventName: 이벤트 이름입니다.
callbackFunction: 이벤트 발생 시 처리할 콜백 함수입니다.
예를 들어, 다음과 같이 chat message 이벤트를 핸들링할 수 있습니다.

socket.on('chat message', function(msg) {
  console.log('message: ' + msg);
});

위 코드는, chat message 이벤트를 수신하여 콜백 함수를 실행합니다. 콜백 함수에서는 msg 인자를 받아 처리할 수 있습니다.

---

예제

아래 예제는 클라이언트에서 message 이벤트를 발생시켜, 서버로 메시지를 전송하고, 서버에서 전송된 메시지를 수신하여 콘솔에 출력하는 전체 코드입니다.

클라이언트

const socket = io();

// 서버로 이벤트 발생
socket.emit('message', 'Hello, World!');

// 서버에서 발생하는 이벤트 수신
socket.on('message', (data) => {
  console.log(data);
});

서버

io.on('connection', (socket) => {
  console.log('a user connected');

  // 클라이언트에서 발생하는 이벤트 수신
  socket.on('message', (data) => {
    console.log(`Received message: ${data}`);
    // 다시 클라이언트에게 이벤트 발생
    io.emit('message', data);
  });
});

위 코드에서, 클라이언트에서 message 이벤트를 발생시키고, 서버에서 수신합니다. 서버에서는 수신된 메시지를 콘솔에 출력합니다.

---

채팅방 분류하기

채팅방 만들기

Socket.join(room [, callback])
클라이언트를 room 이름의 채팅 방에 참여시킵니다. callback 함수는 클라이언트가 방에 참여한 후 실행됩니다.

socket.join('room1', () => {
  console.log('Joined room1');
});

채팅방 나가기

Socket.leave(room [, callback])
클라이언트를 room 이름의 채팅 방에서 제거합니다. callback 함수는 클라이언트가 방에서 제거된 후 실행됩니다.

socket.leave('room1', () => {
  console.log('Left room1');
});