웹 소켓에 대하여

웹소켓

웹소켓이란??

ws프로토콜 기반으로 한 클라이언트와 서버 사이에 지속적인 완전 양방향 연결 스트림을 만들어 주는 기술

ws 프로토콜

TCP(4계층) HTTP 업그레이드 헤더를 이용, handshake 해서 연결

클라이언트 handshake

GET /chat HTTP/1.1
Host: example.com:8000
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Key: dGhlIHNhbXBsZSBub25jZQ==
Sec-WebSocket-Version: 13

서버 handshake

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: Upgrade
Sec-WebSocket-Accept: s3pPLMBiTxaQ9kYGzzhZRbK+xOo=

socket.io

브라우저와 서버간 실시간 통신을 가능하게 해주는 웹소켓 라이브러리

Event Emitter 를 이용, 이벤트를 주고 받는다

socket.on('on', (item) => ...)
socket.emit('post', data, id)

socket io 큰 5가지 특징이 있다.

• 신뢰성
• 자동 연결 지원
• disconnet 탐지
• 바이너리 지원
• 멀티플렉싱 지원

socket.io 를 선택한 이유가 멀티플렉싱 때문인데 멀티플렉싱에 대해 알아보자!

Namespace

socket.io 에서는 Namespace를 지원한다.

단일 공유 연결을 통해 응용프로그램의 로직을 분할할 수 있는 통신 채널이다.

쉽게 말하면, 라우팅 하는 것이라 생각하면 된다.

const firstNamespace = io.of('/first');
const secondNamespace = io.of('/second');

라우팅 하는 거라서 미들웨어를 사용할 수 있다.

firstName.use((socket, next)=>{
    //예를 들어 검증 로직
    
    next()
})

Room

각 네임스페이스에서 임의의 채널을 설정할 수 있는데 이것을 Room 이라고 부른다 Room은 데이터를 소켓의 하위 집합으로 브로드캐스팅 하는데 유용하다.

namespace.('connection', (socket) => {
    socket.join("someroom")
})

namespace.to("someroomt").emit('someevent')

disconnect

io.on('connection', (socket) => {
  socket.on('disconnect', (reason) => {
    // ... 연결이 끊킴
  });

  socket.on('disconnecting', (reason) => {
    // ...연결이 끊기는 중 , 아직 room 은 연결되어있음
  });
});

//reason
io server disconnect	서버에서 연결 끊음
io client disconnect	클라이언트에서 연결 끊음
ping timeout	핑이 타임아웃
transport close	The connection was closed (example: 연결을 읽어버리거나 wifi to 4g 일때)
transport error	The connection has encountered an error

을 이용해서 유저가 선택 중 연결이 끊켰을경우를 방지할 수 있다.

우리가 사용하는 이유??

네임스페이스 와 룸을 적절히 이용하면 좌석 선택 창에 있는 유저들에게 필요한 데이터를 브로드캐스팅 할 수 있기 때문