websocket과 ssl 사용을 위한 nginx 설정

개인프로젝트로 간단한 멀티 테트리스를 만들고 있는데, https + websocket 조합이다 보니 서버 설정이 필요했습니다. 구글링을 통해 해결했고, 방법을 공유 합니다.

1. html

html 파일에 메타 테그를 추가합니다.

<meta http-equiv="Content-Security-Policy" content="upgrade-insecure-requests">

2. javascript

javascript에서 websocket을 연동을 위한 URI를 지정합니다.
( mydomain은 서비스할 도메인명을 넣어줍니다 )

ws = new WebSocket("ws://mydomain/ws");

3. https

nginx 에 ssl 설정을 추가합니다.
mydomain/ws로 연결요청이 들어오면, 8090 포트의 /ws 로 포워딩합니다.

server {
    server_name  mydomain;
    listen 443 ssl;

    location /ws {
        proxy_pass   http://127.0.0.1:8090/ws;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
        proxy_set_header Host $host;
        proxy_set_header X-Real-IP $remote_addr;
        proxy_set_header X-Forwarded-Host $host;
        proxy_set_header X-Forwarded-Server $host;
        proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
    }
}