TIL - 20220919

 오늘은 모던 JavaScript 튜토리얼에서 웹소켓에 대해 공부했다. 작성한 질문은 다음과 같다.

 웹소켓을 사용하는 이유는 서버와 브라우저가 연결을 유지한 채로 데이터를 교환하기 위해서 사용하며 데이터는 패킷 형태로 전달된다. 전송은 양방향으로 이루어진다.

 

 소켓이 정상적으로 만들어지면 다음과 같은 이벤트를 사용할 수 있게 된다.

• open: 커넥션이 제대로 만들어졌을 때 발생
• message: 데이터를 제대로 수신했을 때 발생
• error: 에러가 생겼을 때 발생
• close: 커넥션이 종료됐을 때 발생

 

 new WebSocket()을 호출해 최초 요청을 전송하면 다음과 같은 요청 헤더들이 나온다.

• Origin - 클라이언트 오리진을 나타낸다.
• Connection: Upgrade - 클라이언트 측에서 프로토콜을 바꾸고 싶다는 신호를 보냈다는 것을 나타낸다.
• Upgrade: websocket - 클라이언트 측에서 요청한 프로토콜은 'websocket'이라는 의미다.
• Sec-WebSocket-Key - 보안을 위해 브라우저에서 생성한 키를 나타낸다.
• Sec-WebSocket-Version - 웹소켓 프로토콜 버전이 명시된다.

 

 프레임 내 담긴 데이터 종류로는 다음이 있다.

• 텍스트 프레임 - 텍스트 데이터가 담긴 프레임
• 이진 데이터 프레임 - 이진 데이터가 담긴 프레임
• 핑 혹은 퐁 프레임 - 커넥션이 잘 유지되고 있는지 확인하기 위해 사용하는 프레임으로 서버나 브라우저에서 자동으로 생성하여 보내는 프레임이다.
• 이 외에도 다양한 프레임들이 존재한다.