Socket.io 트러블 슈팅 #1

상황

채팅 목록에서 팀원의 프로필을 클릭 시 채팅 방으로의 join과 leave 이벤트가 모두 이루어져야했다.

 

문제

1. 클릭했을 때 join과 leave가 하나의 함수 안에서 함께 쓸 수 있는가? (어떻게 떠남과 들어옴을 같이하지..?)
2. 함께 쓰일 수 있다면 어떤 제한을 걸어주어야 하는걸까?

해결

역시 스택오버플로우

너무너무 좋은 인사이트를 얻었다.!

moveRoom 이라는 함수를 만들어서

이동 전의 방이름 from과 이동 후의 방이름 to을 인자로 받아서

leave이벤트와 join이벤트에 담아 보내주면 되는 것 이었다.

 

그런데!

맨 처음 입장을 하게되면 oldRoom 이라는건 당연히 없다

그 상태에서 분명 에러가 날 것이라며 혼자 쉐도우 복싱을 해댔는데,

결론은 없어도 아무 문제없었다. 

  	// 입장 + 퇴장
  const moveRoom = (oldRoom, newRoom) => {
    socket.emit("join_room", newRoom);
    leaveRoom(oldRoom);
    setRoomName(() => {
      return newRoom;
    });
	
    // 퇴장
  const leaveRoom = (oldRoom) => {
    socket.emit("leave_room", oldRoom);
    socket.off("chat_list");
  };

	// 채팅 리스트를 받아온다
  socket.on("chat_list", (chat_list) => {
     setMessageList([...chat_list]);
     setShowChat(true);
    });
  };

 

 

추가) 리액트로 만드는 socket.io 채팅앱 구글에 치면

열이면 열 emit, on, join 밖에 없었는데.

currentSocket.off("chat_list");

이건 또 뭐지

라고 생각 하실 분들이 있을 수 있다.

 

socket.io 트러블 슈팅 2편에서 다루겠다.