[TIL] Socket.io 의 on 과 emit의 이해

[오늘의 코딩테스트]

https://ezez99.tistory.com/76

[프로그래머스/JS] 로또의 최고순위와 최저순위

[오늘 한일]

▶ 모의 면접 추가 학습

- 오늘은 모의 면접을 본 뒤 면접 추가 질문에 대해서 추가학습을 하였다.

우선 첫번째 질문에 라우터와 라우팅에 대해서 질문하셨는데, 추가적으로 Windows 운영체제 환경에서 라우팅 테이블을 어떻게 확인하는지에 대해 질문하셨다.

Windows 환경에서 라우팅 테이블을 확인하는 법은 다음과 같다.

CMD를 킨후 -> route print를 하면 현재 라우팅 테이블을 확인할 수 있다.

추가적으로 라우팅 테이블을 직접 추가하거나, 삭제하는 법을 학습 하였다.

1. 라우팅 테이블 직접 추가

CMD를 킨후 -> route add [접근할 IP] mask [subnetmask] [목적지 gateway] (-p)

위 이미지의 내용처럼 적용했다고 했을 때 내용을 해석해보면,

현재 나의 장비에서 192.168.30.xx로 접근하는 ip는 subnetmask 255.255.255.0과 192.168.30.1의 gateway를 타고 가게끔 정해주는 것을 말한다.

-p 는 영구경로로 적용할 때 붙이면된다.

2. 라우팅 테이블 직접 삭제

CMD를 킨후 -> route delete [삭제할IP]

 

▶ Socket.io의 추가 학습

Socket.io를 이번 과제로 학습하였는데 아직 emit과 on에 대한 이해도가 부족해서 추가적인 학습을 진행하였다.

두가지 예시로 on과 emit을 할 수 있다.

1. 클라이언트 -> 서버 의 경우

• io.on

io.on('connection', function(socket) {

});

'connection' : socket.io의 기본 이벤트, 사용자가 웹사이트에 접속하면 자동으로 발생하는 이벤트

• socket.on
  해당 클라이언트에서 메세지를 보낸다.

socket.on('event_name', function(data) {
  console.log('Message from Client: ' + data);
});

2. 서버 -> 클라이언트 의 경우

• io.emit
  서버가 현재 접속해있는 모든 클라이언트에게 이벤트 전달

io.emit('event_name', msg);

• socket.emit
  서버쪽에서 event를 발생시키는 함수
  서버에서 이벤트 발생시키면 클라이언트 페이지의 해당 이벤트 리스너에서 처리
  해당 소켓을 통해 클라이언트에게 메시지 전송

socket.emit('event_name', msg);

---

예시

io.on('connection', function (socket) {
	socket.emit('news', { serverData : "서버 작동" });
	
	socket.on('client login', function (data) {
		console.log(data);
	});
		
	socket.on('disconnect', function(){
		console.log('접속이 종료되었습니다.');
	});

});

connection 안에 각 이벤트를 작성할 땐 socket.on('EVENT 이름', 함수/값/변수) 형식으로 작성

[트러블 슈팅]

1. prettier가 정상적으로 작동 되지 않아서, prettier을 적용 시켰다.

해결 방법

• Format on Save 체크
  

  

• Default Formatte 체크
  

  

2. import 할경우 자동으로 문서.js가 붙게 되게끔 하는 방법

해결 방법

ctrl + shift + p 로 옵션을 열어준다 -> settings.json을 열어준다.-> 밑에 문구를 입력해준다.

  "javascript.preferences.importModuleSpecifierEnding": "js",
  "typescript.preferences.importModuleSpecifierEnding": "js"

 

[오늘의 평가]

오늘은 전체적으로 전에 했던 것을 정리하면서 추가적으로 학습을 진행하였다. 다음번엔 강의로 배운 내용을 토대로 학습을 진행해야겠다!