Detailed steps to configure WebSocket proxy in Nginx

1. Install Nginx

Make sure you have Nginx installed. If not installed, you can use the following command to install:

sudo apt-get update
sudo apt-get install nginx

2. Configure the WebSocket Agent

Edit Nginx configuration files, usually located in/etc/nginx/or/etc/nginx/sites-available/default. The following is a sample configuration showing how to configure a WebSocket proxy.

Sample configuration:

http {
    # Define the upstream block and specify the backend WebSocket server    upstream websocket_backend {
        server :8080;
        server :8080;
    }

    server {
        listen 80;
        server_name ;

        # Configure WebSocket Agent        location /ws {
            proxy_pass http://websocket_backend;
            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-For $proxy_add_x_forwarded_for;
            proxy_set_header X-Forwarded-Proto $scheme;

            # Optional: Set the timeout time            proxy_read_timeout 86400s;
        }

        # Configure static files or other paths        location / {
            root /var/www/html;
            index  ;
        }
    }
}

3. Parameter explanation

proxy_pass: Specify the address of the backend WebSocket server.
proxy_http_version 1.1: Set the HTTP version to 1.1, and the WebSocket protocol requires HTTP/1.1.
proxy_set_header Upgrade $http_upgrade: Passing the clientUpgradeHead.
proxy_set_header Connection "upgrade": Passing the clientConnectionHead, indicating that this is a WebSocket upgrade request.
proxy_set_header Host $host: Passing the clientHostHead.
proxy_set_header X-Real-IP $remote_addr: Pass the real IP address of the client.
proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for: Passing the clientX-Forwarded-ForHead.
proxy_set_header X-Forwarded-Proto $scheme: Protocol (HTTP or HTTPS) that passes the client.
proxy_read_timeout 86400s: Set the read timeout time. WebSocket connections are usually long connections, so a longer timeout time is required.

4. Test configuration

Before reloading Nginx, test the configuration file for syntax errors.

sudo nginx -t

6. Verify the configuration

Ensure that WebSocket connections can be established and communicated normally. You can use the WebSocket client to test on the front end.

Sample front-end code:

<!DOCTYPE html>
<html>
<head>
    <title>WebSocket Test</title>
</head>
<body>
    <script>
        var socket = new WebSocket('ws:///ws');

         = function() {
            ('WebSocket connection opened');
            ('Hello, WebSocket!');
        };

         = function(event) {
            ('Message from server:', );
        };

         = function() {
            ('WebSocket connection closed');
        };

         = function(error) {
            ('WebSocket error:', error);
        };
    </script>
</body>
</html>

Summarize

Through the above configuration, Nginx can serve as a WebSocket proxy to forward the client's WebSocket connection to the backend server. These configurations ensure the correctness and stability of WebSocket connections.

This is the article about the detailed steps for configuring WebSocket Agent in Nginx. For more information about configuring WebSocket Agents in Nginx, please search for my previous articles or continue browsing the following related articles. I hope everyone will support me in the future!