✅ 5주차 주요 진행 사항

WebRTC 연결

• 시그널링 서버
  • 문제 : 미디어가 없거나 권한 허용이 안된 사용자의 시그널링 연결이 안되는 문제
  • 해결 :
    • WebRTC 관련 공식 문서들은 미디어 트랙이 있다는 가정 하에 로직을 짜는 경우가 많아서 해결 방안을 찾기는 어려웠음
    • 공식 문서에서 Media / Data 채널 중 한 개라도 있어야 연결이 가능하다는 것을 발견
    • Media 트랙이 없는 사용자는 Data 채널을 연결하여 네트워크 연결이 가능하게 함.
• Coturn 서버
  • 문제 : Coturn 서버가 Trickle Ice 웹 사이트에서는 정상 동작하지만 배포 환경에서는 403에러를 반환하였음
  • 해결 :
    • https://stackoverflow.com/questions/67180863/coturn-turn-server-error-create-permission-403-forbidden-ip
    • Coturn 서버 설정에서 external-ip은 public-ip를 지정해주는데 Docker 환경에서는 public-ip/private-ip로 설정해줘야 정상 동작 함.

게임 로직 구현

• 다양하게 나누어진 phase 간의 구분과 각각을 잇는 과정이 주요 도전 과제였음
• 성공 ! → 2주의 기적 ..

예외사항 및 에러 핸들링

• 한글 입력 시 마지막 글자가 중복 전송되는 문제 해결
• 무효 표에 대한 처리로직
• 최대인원보다 초과하여 방참가 방지
• 게임 도중 방참가 방지
• 게임 참가자의 발언 여부를 저장하고 있지 않아서 발생한 문제해결

UI 개선

🎯 채팅영역의 UX 개선

• 나와 상대방, 공지의 채팅을 구분하여 처리
• 이전 채팅을 본다면 아래로 바로 넘어갈 수 있도록 버튼이 나타나고 해당 버튼을 누르면 최신 채팅을 볼수 있게 맨 아래로 내려가도록 처리
• 채팅 자동으로 내려가지는 걸로 처리하기 (기본적으로 계속해서 최신 채팅을 볼 수 있음)

🎯 제시어 보여주는 과정에서 framer-motion 라이브러리 사용