[WebSocket] 독학 2일차_1: 기본적인 개념과 동작 방식

🫠 이미 노마드코더 무료강의에서 개념을 한번 잡은 적이 있었기 때문에 한번 더 개념을 정리한다는 생각으로 글을 써보려고 한다.

니코쌤은 node.js를 사용해서 Websocket을 구현하는데, 나는 SpringBoot기반으로 구현할거기 때문에 처음부터 다시..하는걸로..^_ㅠ그래도 개념같은걸 잡는데는 도움이 됐다. node.js도 한번 써보고..허허

🖊️노마드 코더 Websocket-WebRTC 무료강의 : https://nomadcoders.co/noom/lectures/3111

🌱Websocket: 클라이언트-서버 실시간 양방향통신 웹기술

🌼양방향 통신 -> handshake과정을 통해 연결을 생성

🌼Handshake

1. 클라이언트는 서버에 HTTP 요청을 보내고, 서버는 이 요청에 대한 HTTP 응답을 보냄
2. 한번 연결되면 요청-응답 방식이 아닌 원할때마다 데이터를 주고받는 방식으로 되는 것. 이것을 handshake라고 함

🌼TCP(전송 제어 프로토콜)/IP(인터넷 프로토콜) 기반의 프로토콜

TCP: 한 기기에서 다른 기기로 데이터 전송
IP: 데이터의 조각을 최대한 빨리 대상 IP 주소로 보내는 역할

🌼연결을 유지하는 동안 계속해서 데이터를 주고받음(양방향)

🌼Framing

handshake로 연결이 된 이후에 데이터를 주고 받는 것.
이 때, WebSocket은 데이터를 특별한 형태의 프레임(Frame)으로 만들어서 전송함

🌱 HTTP/HTTPS 통신과 다른점

1. 단방향 통신인 HTTP/HTTPS와 다르게 양방향 통신이 가능함
2. 불필요한 header 정보가 전송되지 않아 더 가볍고 빠른 통신이 가능함

🌱Websocket 연결 과정

1. 클라이언트 -> 서버에 WebSocket 연결 요청
2. 서버는 클라이언트의 요청을 받고, WebSocket 연결을 수립(Handshake)
3. 연결되면 양방향 통신이 시작됨(Framing)
4. 연결이 끝나면 클라이언트와 서버는 WebSocket 연결을 종료함(Closing)

🌱Websocket이 사용되는 곳

실시간 채팅, 게임, 주식, 화상채팅 등

🌱노마드코더 보면서 메모장에 했던 정리

🌼WebSocket

• 본격적으로 실시간(real-time)기능을 하게 도와줌

• http (요청/응답의 반복)

  => 즉, 하나의 요청에 응답을 보내면 바로 끝남. real-time이 이루어지지 않음
  => stateless: 백엔드는 하나의 요청이 끝나면 유저를 잊어버림(저장된 쿠키로 새로 요청해서 응답받아야함)

• WebSocket (서버-클라이언트의 양방향 연결)

  => 서버는 유저를 기억함.
  => 한번의 요청(연결)만으로도 여러번의 응답을 보낼 수 있음
  => javascript에서도 사용할 수 있는 코드가 있음
  => 브라우저에는 내장된 WebSocketAPI가 존재
  => 서버-클라이언트 뿐만이 아닌 서버- 서버 소통도 가능