WebSocket proxying in Nginx - Interactive Code Practice

Practice - 5 Tasks

1fill in blank

easy

Complete the code to enable WebSocket proxying by setting the upgrade header.

Nginx

proxy_set_header Upgrade [1];

Drag options to blanks, or click blank then click option'

A"websocket"

B"upgrade"

C"WebSocket"

D"Upgrade"

Attempts:

3 left

💡 Hint

Common Mistakes

Using uppercase 'WebSocket' instead of 'upgrade'.

Using 'Upgrade' or 'websocket' as the header value.

The Upgrade header must be set to "upgrade" (case-sensitive) to enable WebSocket proxying in nginx.

2fill in blank

medium

Complete the code to set the connection header for WebSocket proxying.

Nginx

proxy_set_header Connection [1];

Drag options to blanks, or click blank then click option'

A"keep-alive"

B"upgrade"

C"close"

D"Upgrade"

Attempts:

3 left

💡 Hint

Common Mistakes

Using lowercase 'upgrade' instead of 'Upgrade'.

Using 'keep-alive' or 'close' which are incorrect for WebSocket.

The Connection header must be set to "Upgrade" (capital U) to properly establish a WebSocket connection.

3fill in blank

hard

Fix the error in the proxy_pass directive to correctly proxy WebSocket connections.

Nginx

proxy_pass http://[1];

Drag options to blanks, or click blank then click option'

Abackend_server:8080

Bbackend_server/ws

Cbackend_server:8080/ws

Dbackend_server

Attempts:

3 left

💡 Hint

Common Mistakes

Adding a URI path like '/ws' in proxy_pass causing incorrect routing.

Omitting the port when backend listens on a specific port.

The proxy_pass should point to the backend server's address and port without a URI path when proxying WebSocket connections to avoid URI rewriting issues.

4fill in blank

hard

Fill both blanks to correctly set headers for WebSocket proxying.

Nginx

proxy_set_header Upgrade [1];
proxy_set_header Connection [2];

Drag options to blanks, or click blank then click option'

A"WebSocket"

B"Upgrade"

C"upgrade"

D"Keep-Alive"

Attempts:

3 left

💡 Hint

Common Mistakes

Using uppercase or incorrect header values.

Mixing up the values between the two headers.

For WebSocket proxying, Upgrade header must be set to "upgrade" and Connection header to "Upgrade".

5fill in blank

hard

Fill all three blanks to complete the nginx location block for WebSocket proxying.

Nginx

location /ws/ {
    proxy_pass http://[1];
    proxy_http_version [2];
    proxy_set_header Upgrade [3];
}

Drag options to blanks, or click blank then click option'

Abackend_ws

B1.1

C"WebSocket"

D1.0

Attempts:

3 left

💡 Hint

Common Mistakes

Using HTTP version 1.0 which does not support WebSocket.

Incorrect or missing quotes around header values.

Wrong backend server name.

The proxy_pass points to the backend WebSocket server, proxy_http_version must be 1.1 for WebSocket support, and Upgrade header must be "WebSocket".

Practice

1. What is the main reason to use proxy_set_header Upgrade $http_upgrade; in nginx when proxying WebSocket connections?

easy

A. To tell nginx to allow the connection to switch protocols to WebSocket

B. To set the client's IP address in the header

C. To enable gzip compression for WebSocket data

D. To disable caching for WebSocket requests

Solution

1. Step 1: Understand the Upgrade header role

   The Upgrade header tells the server to switch from HTTP to another protocol, here WebSocket.

2. Step 2: Recognize nginx's proxy_set_header usage

   Setting proxy_set_header Upgrade $http_upgrade; passes the client's Upgrade header to the backend, enabling protocol switching.

3. Final Answer:

   To tell nginx to allow the connection to switch protocols to WebSocket -> Option A

4. Quick Check:

   Upgrade header enables protocol switch = A [OK]

Hint: Upgrade header signals WebSocket protocol switch [OK]

Common Mistakes:

• Confusing Upgrade with client IP headers
• Thinking it enables compression
• Assuming it disables caching

2. Which of the following nginx configuration snippets correctly enables WebSocket proxying?

easy

A. proxy_http_version 1.0; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade";

B. proxy_http_version 1.1; proxy_set_header Upgrade "websocket"; proxy_set_header Connection "close";

C. proxy_http_version 2.0; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "keep-alive";

D. proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade";

Solution

1. Step 1: Identify required HTTP version for WebSocket

   WebSocket proxying requires HTTP/1.1 because HTTP/1.0 does not support the Upgrade header properly.

2. Step 2: Check correct headers for WebSocket

   The Upgrade header must be passed as $http_upgrade and Connection header must be "upgrade" to maintain the protocol switch.

3. Final Answer:

   proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; -> Option D

4. Quick Check:

   HTTP/1.1 + Upgrade + Connection upgrade = B [OK]

Hint: Use HTTP/1.1 and set Upgrade and Connection headers correctly [OK]

Common Mistakes:

• Using HTTP/1.0 instead of 1.1
• Setting Connection to keep-alive or close
• Hardcoding Upgrade header instead of using $http_upgrade

3. Given this nginx config snippet inside a location block:

proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
proxy_pass http://backend_server;

What will happen if a client tries to establish a WebSocket connection through nginx?

medium

A. The connection will be cached by nginx, causing stale data.

B. The WebSocket connection will be successfully proxied to the backend server.

C. The connection will be proxied but without protocol upgrade, causing failure.

D. The connection will fail because HTTP/2 is required for WebSocket.

Solution

1. Step 1: Analyze HTTP version and headers

   The config uses HTTP/1.1 and sets Upgrade and Connection headers correctly for WebSocket proxying.

2. Step 2: Understand nginx behavior with this config

   nginx will forward the WebSocket upgrade request to the backend, enabling a successful WebSocket connection.

3. Final Answer:

   The WebSocket connection will be successfully proxied to the backend server. -> Option B

4. Quick Check:

   Correct HTTP version and headers = successful proxy [OK]

Hint: HTTP/1.1 + Upgrade + Connection upgrade = success [OK]

Common Mistakes:

• Thinking HTTP/2 is required for WebSocket
• Assuming protocol upgrade is automatic without headers
• Believing nginx caches WebSocket connections

4. You have this nginx config for WebSocket proxying:

proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "keep-alive";
proxy_pass http://backend;

Why might WebSocket connections fail with this setup?

medium

A. Because Connection header should be "upgrade" not "keep-alive" for WebSocket

B. Because proxy_http_version should be 1.0 for WebSocket

C. Because Upgrade header should be hardcoded to "websocket"

D. Because proxy_pass URL is missing a trailing slash

Solution

1. Step 1: Check Connection header value

   For WebSocket proxying, Connection header must be "upgrade" to signal protocol switch.

2. Step 2: Identify impact of incorrect Connection header

   Using "keep-alive" prevents the protocol upgrade, causing WebSocket connection failure.

3. Final Answer:

   Because Connection header should be "upgrade" not "keep-alive" for WebSocket -> Option A

4. Quick Check:

   Connection header must be upgrade for WebSocket [OK]

Hint: Connection header must be "upgrade" for WebSocket [OK]

Common Mistakes:

• Using keep-alive instead of upgrade
• Setting HTTP version to 1.0
• Hardcoding Upgrade header instead of using $http_upgrade

5. You want to proxy WebSocket connections through nginx to two backend servers for load balancing. Which configuration snippet correctly supports WebSocket proxying with load balancing?

hard

A. upstream ws_backend {
server backend1.example.com;
server backend2.example.com;
}
location /ws/ {
proxy_pass http://ws_backend;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "close";
}

B. upstream ws_backend {
server backend1.example.com;
server backend2.example.com;
}
location /ws/ {
proxy_pass http://ws_backend;
proxy_http_version 1.0;
proxy_set_header Upgrade websocket;
proxy_set_header Connection "keep-alive";
}

C. upstream ws_backend {
server backend1.example.com;
server backend2.example.com;
}
location /ws/ {
proxy_pass http://ws_backend;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}

D. upstream ws_backend {
server backend1.example.com;
server backend2.example.com;
}
location /ws/ {
proxy_pass http://ws_backend;
proxy_http_version 2.0;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "upgrade";
}

Solution

1. Step 1: Confirm HTTP version and headers for WebSocket

   HTTP/1.1 is required, and headers Upgrade and Connection must be set to allow protocol upgrade.

2. Step 2: Check load balancing setup and header correctness

   upstream ws_backend { server backend1.example.com; server backend2.example.com; } location /ws/ { proxy_pass http://ws_backend; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; } uses correct HTTP version, headers, and defines upstream servers for load balancing properly.

3. Final Answer:

   upstream ws_backend { server backend1.example.com; server backend2.example.com; } location /ws/ { proxy_pass http://ws_backend; proxy_http_version 1.1; proxy_set_header Upgrade $http_upgrade; proxy_set_header Connection "upgrade"; } -> Option C

4. Quick Check:

   HTTP/1.1 + Upgrade + Connection upgrade + upstream = A [OK]

Hint: Use HTTP/1.1, Upgrade and Connection headers plus upstream for load balancing [OK]

Common Mistakes:

• Using HTTP/1.0 or 2.0 instead of 1.1
• Setting Connection to keep-alive or close
• Hardcoding Upgrade header instead of using $http_upgrade