SSL 연동 후 Socket 연결 트러블슈팅

문제

로컬 환경에서 소켓.io를 이용해 채팅 기능을 성공적으로 구현하였으나, 서버에 배포 후 SSL을 적용한 상태에서 소켓 연결이 되지 않는 문제가 발생했습니다.

해결 방법

해당 부분에서 문제가 생길 수 있는 여러 부분을 살펴보았습니다.

클라이언트 측에 ‘wss://’ 프로토콜이 아닌 ‘ws://’을 ****사용하고있지 않은지, ****방화벽 설정을 확인하고, WebSocket을 사용하는 포트가 열려 있는지 등 여러 문제 가능성을 고려하였고 문제를 분석하기 시작했습니다.

• 문제 분석
  • 로컬 환경에서 Socket.io가 정상적으로 동작하였으므로, 배포 환경에서의 설정 문제 의심
  • SSL을 적용한 HTTPS 통신이 실패한 것으로 보아, 소켓 요청이 제대로 프록시되지 않고 있는 것
• 해결책 모색
  • socket.io 공식 문서에서 SSL 연동 시 Nginx와의 연동 방법에 대한 정보를 찾았습니다.
  • Nginx에서 소켓 요청을 프록시하는 설정이 필요하다는 것을 확인했습니다.

Nginx 설정 수정

• Nginx 설정 파일에 다음과 같은 프록시 설정을 추가했습니다:

location ^~ /socket {
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    proxy_set_header Host $host;

    proxy_pass <http://localhost:3000>;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection "upgrade";
}

• 클라이언트 소켓 연결 코드도 SSL이 적용된 배포된 주소인 것을 다시 한 번 확인해주었습니다.

const socket = io(<https://dfgdwssegf.shop>) 

 

결과

• Nginx에서 소켓 요청이 올바르게 프록시되면서, 클라이언트에서 SSL을 통해 소켓 서버에 정상적으로 연결되었습니다.
• 이로써 SSL 적용 후에도 문제없이 실시간 채팅 기능이 작동하게 되었습니다.