[NodeJs] Socket-io

[NodeJs] Socket-io updated_at: 2024-01-24 15:37

Socket.io 다루기

socket.io install

npm i socket.io

socket.io 의 기본적인 형태

const server = require('http').createServer(() => {});
const io = require('socket.io')(server);

io.on('connection', (socket) => { // 클라이언트에서 소켓에 연결을 요청할 경우
  
});

server.listen(3000);

on

client 에서 보낸 메시지를 받을 때 사용한다.

io.on('connection', (socket) => {
  socket.on('message', (msg) => {
  });
});

emit

emit를 이용하여 클라이언트로 메시지를 전송할 수 있다.

const server = require('http').createServer(() => {});
const io = require('socket.io')(server);

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

  socket.on('message', (msg) => {
    console.log('message: ' + msg);

    // io 는 모든 사람에게 보낼때 (메시지를 보내는 사람 포함)
    // io.emit('some event', {});

    // 나를 제외한 모든 사람에게 보낼때
    // socket.broadcast.emit('hi');

    // 소켙의 모든 사람에게 보낼때
    // socket.emit('hi');

    // room 으로 메시지 전달 (나를 제외)
    socket.broadcast.to(room).emit('chat', req); 
    socket.to("roomName").emit('userLeave', req); // 4.x는 이렇게 사용
  });
});

server.listen(3000);

room

room은 채팅하는 사람들을 하나의 그룹으로 묶는 역활을 한다.

join

io.on("connection", socket => {
  ..........
  socket.join(roomName);
  socket.room = roomName; // 현재의 room을 socket.room에 할당하면 이후 프로그램 하기에좋다.
  ..........
  let clients = io.sockets.adapter.rooms.get(socket.room); // Set(3) { SocketIds.... } // 현재 룸에 속한 socket 정보를 가져올 수 있다.
  clients.size; // 현재 room에 속한 클라이언트 수를 가져올 수 있다.

  io.in(roomName).emit(key, obj); // 현재 room 에 속한 사람에게 정보를 보낸다.
  io.to(roomName).emit(key, obj); // 나(sender)를 제외한 현재 room 에 속한 사람에게 정보를 보낸다. (버젼에 따라 다른데 현재는 이 부분이 제대로 동작 하지 않은 것 같음)
}

leave

room을 떠날때 사용한다.

socket.leave(roomName);

callback 사용하기

socket io 에서 클라이언트와 정보를 주고 받을때 on, emit 만 가능한 것은 아니다.
socket.io도 결국은 javascript이므로 javascript에서 사용하는 callback 함수와 같이 socketIo에서도 사용가능하며 이것을 이용하여 서로 통신을 할 수 있다.
아래와 사용하면 코드도 간단해지고 가독성도 좋다.

  • server
socket.on('join', (info, callback) => { 
  ..........
  callback('result');
});
  • client
socket.emit("join", {}, (result)=>{});

평점을 남겨주세요
평점 : 5.0
총 투표수 : 1

질문 및 답글