문제
로컬 환경에서 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";
}
JavaScript
복사
•
클라이언트 소켓 연결 코드도 SSL이 적용된 배포된 주소인 것을 다시 한번 확인해 주었습니다.
const socket = io(https://dfgdwssegf.shop)
JavaScript
복사
결과
•
Nginx에서 소켓 요청이 올바르게 프록시되면서, 클라이언트에서 SSL을 통해 소켓 서버에 정상적으로 연결되었습니다.
•
이로써 SSL 적용 후에도 문제없이 실시간 채팅 기능이 작동하게 되었습니다.