1 분 소요

project

오늘 한 일(회고)

  • 소켓 공부 및 프로젝트에 적용하기

01. 소켓이란?

1) 소켓에 대한 간단한 설명
소켓의 역할?

현실로 비유하면 마치 벽에 있는 콘센트 구멍과 비슷하다!
우리가 전기를 사용하기 위해 반드시 거처야 하느 연결부에 해당한다.

  • 네트워크에서의 소켓은?
    우리가 네트워크에서 데이터를 송수신하기 위해 반든시 거쳐야하는 연결부에 해당한다.
소켓의 종류?

소켓의 역할은 언제나 같지만 종류는 여러가지~ 대표적으로 TCP, UDP 프로토콜을 사용하는 2가지 소켓이 있습니다.

아주 일반적으로 안정적인 데이터 송수신을 위해 TCP 소켓을 사용하는 경우가 대부분이지만, 일부 패킷이 손실되어도 괜찮거나 빠른 전송 속도가 필요한 경우 UDP 소켓을 사용하기도 함.

패킷이란?

네트워크 소켓이 현실의 콘센트와 비슷하다면, 패킷은 쉽게 말해 콘센트 배선에 흐르는 전기와 비슷합니다. 소켓을 통해 송수신하는 데이터 덩어리 하나가 한개의 패킷이라고 표현합니다.

2) 웹소켓은 무엇인가?

실시간 웹 서비스를 제공하기 위해 만들어진 Socket이라고 생각하면 됩니다.

최근 Google Docs 등 여러 협업툴이 실시간 공동 편집 기능, 웹 메신저 등에서 많이 사용되는 기술로 최근 점점 많이 사용하는 기술이지만 일부 브라우저들이 웹소켓을 지원하지 않기 때문에 모든 브라우저에서의 동작을 보장하지는 못합니다.

socket.io?

자바스크립트를 사용해 웹소켓을 사용하길 원한다면 가장 많이 사용되는 라이브러리입니다. 그러나 이 라이브러리는 순수한 웹소켓 기술만 이용한 라이브러리가 아닙니다.

위에서 말했듯 웹소켓 기술은 아직 모든 브라우저에서 동작하지는 못하기 때문에, 모든 사용자를 고려해야 하는 경우 실시간성 기능 구현에 어려움이 생기게 됩니다.

이 어려움을 해결하기 위해 socket.io는 웹소켓을 사용할 수 없는 브라우저인 경우 서버에서 데이터를 일정 간격마다 받아오는 polling 기능으로 실시간 기능 구현을 가능케 해줍니다.

socket.io는 웹소켓과 다르다?

그렇습니다! 엄밀히 따지면 socket.io는 웹소켓을 포함하여, 웹소켓을 사용하지 못하는 환경에서도 웹소켓과 비슷하게 사용이 가능하도록 구현해놓은 라이브러리입니다.

그렇기 때문에 socket.io는 웹소켓과 완전히 동일하다고 오해하지 않으시길 바랍니다!

추가 참고 내용: https://d2.naver.com/helloworld/1336

02. socket.io 내 프로젝트에 적용해보기

일단 내가 하고 싶은거는 병원 예약을 했을 때 병원 관리자가 그 이벤트를 볼 수 있게 할 생각이다.
그렇다면 일단 이미 예약을 했을 때 들어오는 데이터가 어떻게 되는지 살펴보자

[Object: null prototype] {
  relationship: '본인',
  name: '김크리스',
  phone: '010-1111-1111',
  reservationdate: '2023-03-30',
  reservationtime: '10:30 ~ 11:00',
  contents: '진구야 공부 잘하고 있지?',
  idnumber: '960625-1111111',
  proxyName: '',
  address: '광주광역시 북구 비엔날레로 162(용봉동) 우리집 아니야'
}

일단 이런 식으로 데이터가 들어온다.


그리고 이렇게 데이터를 받으면

{
  relationship:"본인",
  name:'김크리스',
  phone: '010-1111-1111',
  reservationdate: '2023-03-30',
  reservationtime: '10:30 ~ 11:00'
}

이런 형식으로 예약한 데이터를 보낼 수 있도록 해야겠다.

일단 통신 자체는 성공을 하긴 했는데 한 가지 생각하지 못한게 있었다.
다대일 소켓 통신은 가능했지만 일대일 / 일대일/ 일대일 이렇게 여러 룸 형태의 소켓방을 만드는데 실패했다… 일단 이번에는 프로젝트 마감 기한까지 시간이 많지 않아서 패스 했다.

내일 할일

  • 프로젝트 브로셔 작업

참고자료