socket.io 정리

twoStones·2022년 5월 29일
1

socket.io

목록 보기
1/1

음...클라이언트가 새로고침을 하면 소켓이 끊겼다가 다시 붙는거네??

Server

// connection event handler
// connection이 수립되면 event handler function의 인자로 socket이 들어온다
io.on('connection', (socket) => {

});
  • connection event handler를 정의해 놓으면 클라이언트가 socket.io 서버에 접속했을 때 connection 이벤트가 발생
  • 이 때 파라미터로 socket 객체가 전달되고 이 socket 객체는 개별 클라이언트와의 상호 작용을 위한 객체이다. 즉, 각각의 클라이언트와의 메세지를 주고 받는 객체이다
  • io 객체는 연결된 모든 클라이언트와의 상호 작용을 위한 객체이다
// 수신 event handler
socket.on('이벤트 이름', (data) => {

});
  • 현재 접속되어 있는 각 클라이언트로부터 메시지를 수신하기 위해서는 on 메서드를 사용
  • 이벤트명은 클라이언트와 약속한 이름
  • data 파라미터에는 클라이언트가 보낸 메시지가 전달된다
// 접속된 모든 클라이언트에게 메시지를 전송한다
io.emit('event_name', msg);

// 메시지를 전송한 클라이언트에게만 메시지를 전송한다
socket.emit('event_name', msg);

// 메시지를 전송한 클라이언트를 제외한 모든 클라이언트에게 메시지를 전송한다
socket.broadcast.emit('event_name', msg);

// 특정 클라이언트에게만 메시지를 전송한다
io.to(id).emit('event_name', msg);

Client

<script src="/socket.io/socket.io.js"></script>
    <script>
      const socket = io();
    
    </script>
  • socket.io 서버에 접속하기 위해 io() 메소드를 호출
  • 생성된 socket으로 서버로의 메시지 송신 또는 서버로부터의 메시지 수신을 할 수 있다.
    <script>
		socket.emit("event_name", msg);    
    </script>
  • 접속되어 있는 소켓 서버로 메시지를 보내기 위해서 emit 메서드를 사용
    <script>
      socket.on("event_name", function(data) {
        console.log('Message from Server: ' + data);
      });
    </script>
  • 접속되어 있는 소켓 서버로부터 메시지를 받기 위해서 on 메서드를 사용한다

Namespace

  • socket.io 는 경로(path)를 할당하는 의미로 socket에 namespace를 지정할 수 있다
  • 즉, path 에 따라 클라이언트가 해당 path에 접근해야지만 socket이 접속된다
  • namespace를 특별히 지정하지 않은 경우는 디폴트 namespace인 / 를 사용하게 된다
// Server-side
var nsp = io.of('/my-namespace');

nsp.on('connection', function(socket){
  console.log('someone connected'):
});
nsp.emit('hi', 'everyone!');

// Client-side
// 지정 namespace로 접속한다
var socket = io('/my-namespace');

room

  • 네임스페이스 내에서 임의의 채널을 지정할 수 있게 하는 것이 room 이다.
  • room 을 통해서 room에 join 한 클라이언트한테만 데이터 송수신을 할 수 있다
profile
일단 작성

0개의 댓글