아꿈사 발표 node js 프로그래밍 8장
DESCRIPTION
12년 3월 24일 아꿈사 발표Node JS 프로그래밍 (변정훈 저) 8장TRANSCRIPT
Node JS 프로그래밍
아꿈사 8 장최우영
8 장 익스프레스와 Socket.IO 를 이용한 Simple Chat 예제
> express simple-chat> cd simple-chat> npm install> npm install socket.io
준비
로컬 접속
8 장 익스프레스와 Socket.IO 를 이용한 Simple Chat 예제
닉네임 입력
새로운 방 생성
기존 방 입장
방에서 나가기
참가자 목록 갱신
메시지 동기화
메시지 보내기
유저 닉네임 처리
views/layout.jade
서명없는 UTF8
미리 클래스 정의
JQuery 는 그냥 호스팅 받아서 ..
views/index.jade
닉네임 폼
닉네임 유효성 체크
POST, /enter
app.js
views/index.-jade
공백 상태에서 입장 클릭
자바 스크립트에서 유효성 검사
닉네임 입력
404 에러
chat.js모듈 생성
닉네임 관리
true 를 반환하는 객체의 목록 리턴
app.jschat 모듈 사용
유저 닉네임 관리를 위해 세션과 쿠키 사용
app.js
POST, /en-ter
세션에 추가
views/enter.-jade
views/enter.jade
채팅방 생성
views/enter.js
POST, /make-Room
chat.js
채팅방 관리
chat.js
중복 검사
채팅방 추가
방 정보와 참가자 정보를 관리하기 위해JSON 으로 저장
나중에 채팅 참가하는 사람을 추가하기 위해 관리하는 목록
app.js
방 추가
views/makeRoom.jade 새로 생성
/join/ 방이름
app.js
/join/ 방이름 의 라우팅 처리요청 파라미터 변수 :idreq.params.id
views/room.jade
app.js
chat.js
map 함수를 이용해 이름만으로 된 배열 리턴
views/enter.jade
배열 출력을 위해 each 문 사용
Socket.IO 를 사용한 채팅방 입장 처리
views/layout.jade
socket.io 라이브러리 사용
views/room.jade
대화내용 창
참가자 출력 창
메시지 전송 창
views/room.jade
챗윈도우에 메시지 기록 ,스크롤바 이동
views/room.jade
서버 연결 후 접속을 요청한다 .
다른 사람의 입장 이벤트
rooms.jssocket.io 모듈화
모듈을 함수 형태로정의
room.js
방에 입장
방에 입장한 모든 사용자에게참가 이벤트 알림
app.js
모듈을 함수처럼 사용
Socket.IO 를 사용한 채팅 구현
views/room.jade
폼 전송 막기
메시지 전송 후 입력창 지우기
room.js
메시지 브로드 캐스팅
채팅 참가자 관리
chat.js
채팅 참가자의 배열 리턴
app.js
참가자 리스트를 뷰파일에 전달
room.js
views/room.jade
li 태그를 제거할 수 있도록아이디를 추가
views/room.jade
방 접속자 관리
채팅방 나가기
views/room.jade
views/room.jade
li 참가자 목록 제거
chat.js
채팅방을 찾아서 해당 참가자 제거
rooms.js
제거하고 브로드 캐스팅
정리
express 와 socket.io 사용쉽게 socket.io 를 이용해 실시간 통신 작업할 수 있음을 알았다 .