크래프톤 정글 week15, day114 - 대기방 api 구현, 소켓 이용해 채팅 트라이, 커밋 이슈

대기방 재희 듀오로 거의 다 구현

방 참여 시 생성된 방의 코드를 이용해 참여하기, 랜덤매치에서 들어갈 방이 있으면 거기로 들어가고 없으면 새로 생성하기, 나갈 때 방 유저 목록에서 본인 제외하기, 노래 선택 시 그 노래로 저장되기 등, 대기방에 연결할 api는 거의 다 구현했다. 이제 남은 부분은 자잘한 기능들과 소켓 통신 부분인데 한번 해봐야 감을 잡을 것 같다.

 

프론트에서 토큰 안넣어서 인증 오류 이슈

오전에 계속 인증에러가 발생해서 프론트 백 둘 다 코드를 뒤져봤는데, 그냥 프론트가 요청보낼 때 토큰을 담지 않아서 발생한 문제였다.

팀 프로젝트에서 구성한 기능들은 거의 다 로그인 이후 생성되는 토큰이 있어야 진입이 가능한데 정작 본인이 토큰을 세션에 저장해놓고 헤더에 넣어주질 않았다. 어이없는 실수라 두고두고 까일 예정

 

소켓 이용해서 채팅 만들다가 때려치고 내일 하기로 함

유튜브 강의를 보고 채팅방 만드는 코드를 따라했을 땐 잘 됐는데, 프로젝트 코드에 맞게 바꾸려고 하니까 에러가 많이 발생했다. 프론트에서 변경할 점을 emit으로 서버에 보내고 서버에서 변경된 값을 클라에 전달해서 on으로 받는 형식인데 그 안에서 작동되는 콜백함수를 제대로 작성을 안해줘서 그런건가 계속 에러가 발생하여 내일 다시 작업해보기로 했다.

 

커밋 충돌 이슈

프론트가 셋이라 코드 충돌이 안나게 관리를 잘 해야 하는데 해당 브랜치 코드를 땡겨오지 않아서 충돌이 발생했었다.

정해둔 규칙으로 작업할 땐 feat라는 브랜치를 따서 완성되면 dev로 올리는 역할인데 하나씩 업데이트하면서 dev와 feat를 동기화를 시켜줬어야 했지만 그냥 작업한 코드만 dev로 올리는 바람에 똑같은 코드 똑같이 비교하면서 충돌이 계속발생했다.

다른건 그냥 수정하면 되지만 package.lock.json에러는 진짜 거지같더라. 코드도 2만자에 가까워서 엄청 렉걸리는데 충돌때문에 다 확인해야 해서 화면 렉걸리면서 하느라 눈알 빠질 뻔했다.

 

새로 안 기능

use navigate로 데이터 전송 가능하다. 근데 페이지가 많아지면 매번 써줘야 해서 이래서 리덕스를 쓰나보다.

axios all로 api 여러개 전송 가능하다. 이 부분은 여러 api를 가져와야 할 때 한번 사용해 보려고 한다.

sessionStorage.clear()로 토큰 전체 삭제 가능한데, 이걸 진작 알았어야 했는데 토큰에 담은 userId, token, socketId 등 하나씩 삭제하고 있었다.

 

학습 시간 : 11 ~ 26시