웹소켓과 Nginx 동시 사용시 문제점

클라이언트 단에서 SocketJS와 Stomp를 이용해 연결했으며 서버 단은 Spring으로 구성했습니다.

 

문제가 발생했을 당시 상황

아래와 같은 문제점들은 사실 로컬에서도 발생합니다. 보통 웹소켓 연결 endPoint를 잘못 매칭했거나 웹소켓 연결에 CORS설정을 해놓지 않아서 발생하기에 간단히 해결이 됐습니다.

여기서 저희 팀에서 했던 생각은 endPoint매칭 및 CORS에 대한 대처가 됐다 였습니다.
그러나 배포 환경에서 실행했을 때 Websocket connection failed와 CORS가 발생했습니다.

 

Nginx사용 시 문제점 

조금 검색해본 결과 nginx와 Websocket을 함께 사용할 시 주의해야 할 점으로 웹소켓 연결을 위해 아래의 헤더를 추가해줘야 한다는 것이었습니다.

location /ws { #웹 소켓 연결을 위한 Endpoint
  proxy_pass http://localhost:8080; #웹 소켓 서버가 있는 Origin(Spring)

  proxy_http_version 1.1;
  proxy_set_header Upgrade $http_upgrade;
  proxy_set_header Connection "Upgrade";
  proxy_set_header Host $host;
}

 

의문점

분명 로컬에서 실행했을 때는 웹소켓 연결을 할 때 Client측에서 upgrade헤더를 자동으로 추가하는 것을 확인했는데 왜 위와 같이 nginx에서 다시 한번 upgrade헤더를 추가해줘야 할까요??

 

이유는 웹소켓 연결을 위해 담아줘야하는 헤더(Connection, Upgrade)들이 "Hop By Hop" 헤더이기 때문이었습니다.
단일 전송 레벨에서만 의미가 있는 헤더들이죠 즉, 이 헤더들은 메시지가 한 호스트에서 다음 호스트로 전달될 때마다 독립적으로 처리되어야 합니다.