[NODE] web socket을 응용한 1:N 채팅 만들기 기획

서론 

이번 주 목요일 드디어 계명대학교에서 마지막 시험을 치뤘다. 후련한 마음이 앞서며 나를 괴롭혔던 많은 비효율적인 학교 행정과 수업에서 벗어난다 생각하니 춤이라도 추고 싶은 심정이다. 

 

대학교 수업과 개발 일을 병행하면서 지내다 보니 너무 자기계발에 소홀했다는 생각도 들고, 개발 도중에 웹소켓이라는 놈의 정체에 대해서 늦게 알기도 해서 웹소켓을 응용하여, 병원 홈페이지나 중고차 사이트에서 사용하는 1:N 채팅을 만들어 볼까 싶어 기획하였다. 1 : N 채팅은 고객은 사이트 관리자와만 채팅이 가능하지만, 사이트 관리자는 대화를 시도한 모든 사용자들과 소통이 가능하다. 여기에 조금 덧 붙여 기존 1:N 채팅 프로그램은 종료시에 더 이상의 소통이 불가능 하지만, 이 프로그램은 종료하여도 다시 접속 할 수 있게 끔 할 예정이다.

 

일반 사용자 레이아웃 및 설명 

 

일반 사용자 접속 화면

ID가 존재 하지만 비밀번호가 다를 때

일반 사용자는 ID를 KEY로 식별하며 이 ID는 한개의 대화방을 식별하는 PRIMARY KEY이기도 하다. ID를 이용하여 사용자가 이 대화방을 식별하여 접속 한다면 다수의 사용자가 고의든 실수든 접속 할 수 있는 가능성이 존재한다. 그렇기에 대화방에 PASSWORD 속성을 두어 이를 SUB KEY로 활용한다면, 타인의 대화방 접속 확률을 줄일 수 있을 것이다. 

 

일반 사용자 대화창 

위의 그림 1,2 의 프로세스를 진행하고 접속을 하게 되면 서비스를 제공하는 관리자의 소개글을 처음 받아보게 되며, 화면 하단에 존재하는 인풋을 이용하여, 관리자에게 메세지를 전송 할 수 있게 된다. 

 

관리자 레이아웃 및 설명 

 

 

관리자의 경우 화면 왼쪽에 생성된 대화창이 읽지 않은 대화방이 먼저 정렬 기준이 되며 그 중에서, 가장 빠른 대화가 존재하는 대화 기준으로 정렬 될 것이다. 

 

 

사용 스택 

단순하게 랜덤 채팅 같이 상대방의 대화기록이 남지 않아도 되는 채팅이 아니기 때문에 이 프로젝트에는 데이터베이스가 존재한다. 그리고 데이터를 사용자들에게 전송해야 하는 서버가 필요하다.

 

UI : HTML/CSS/JQUERY

DATABASE : MYSQL

SERVER :  NODE.JS

 

고려사항

1. 웹 소켓으로 양방향 실시간 통신이 진행 되어야 한다. 

2. 사용자는 접속 종료 후 재 접속이 가능하기에, 재 접속 후에는 기존 대화 내용을 풀링해야한다. 

3. 두명의 사용자가 같은 방에 접속 할 수 있으니 이런 경우에는 접속을 방지 해야 한다. (나중에 해결)

4. 상대방의 소켓 정보를 식별 해야 한다.

 

요구 사항 정리

ER DIAGRAM

정규화가 진행 되지 않은 다이어그램

 

끝으로 

 

이 기능의 UI를 리액트로 구현 할까 했지만 굳이 한 문서에서 관리자 전용 페이지와 USER를 같이 만드는 건 좋지 못하다는 판단이 들어 그냥 귀찬 더라도 제이쿼리를 사용하기로 했다. 또한 NODE.JS나 DB내용이 동시에 진행되기 때문에, JAVASCRIPT 카테고리에서 NODE.js로 이동하기로 결정했다.