Efficient communication implementation between Nginx Proxy Manager and WebSocket

Nginx Proxy Manager (hereinafter referred to as NPM) is an Nginx-based proxy management tool that provides a simple and powerful way to manage multiple reverse proxy servers. Recently, I encountered a problem when using NPM: how to achieve efficient communication between NPM and WebSocket. In this article, I'll share my experiences and lessons learned in achieving this goal, and provide concrete code examples.

Before we begin, let’s take a brief look at WebSocket. WebSocket is a protocol for full-duplex communication over a single TCP connection. Unlike HTTP, WebSocket allows the server to actively send data to the client without requiring the client to make a request. Due to its low latency and high efficiency, WebSocket is very popular in real-time applications, such as chat applications, real-time data transmission, etc.

NPM uses Nginx to handle HTTP and HTTPS requests and provides reverse proxy functionality. In order to achieve efficient communication with WebSocket, we need to configure NPM to forward WebSocket requests and correctly handle related header information. The following is a simple Nginx configuration example:

server {
    listen 80;
    server_name example.com;
    
    location / {
        proxy_pass http://backend;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
    }
    
    location /ws/ {
        proxy_pass http://backend;
        proxy_http_version 1.1;
        proxy_set_header Upgrade $http_upgrade;
        proxy_set_header Connection "Upgrade";
    }
    
    location /api/ {
        ...
    }
    
    location /admin/ {
        ...
    }
    
    ...

    upstream backend {
        server backend.example.com;
    }
}

In the above configuration, we use two location blocks to handle WebSocket requests. The first location block is used to handle WebSocket requests under the root path, while the second location block is used to handle WebSocket requests starting with /ws/. In these two location blocks, we use the proxy_pass directive to forward the request to the backend server and set the relevant HTTP header information to ensure that the WebSocket request can be correctly delivered to the backend server.

In addition to configuring Nginx, we also need to implement WebSocket related logic on the back-end server. Here is a simple example implemented using Node.js and the WebSocket library:

const WebSocket = require('ws');

const wss = new WebSocket.Server({ port: 8080 });

wss.on('connection', (ws) => {
    console.log('Client connected');

    ws.on('message', (message) => {
        console.log(`Received: ${message}`);
    });

    ws.send('Hello, client!');
});

In the above code, we create a WebSocket server and handle new connections in the connection event. In the connection event handler, we can handle the message from the client and send the response.

Using the above Nginx configuration and WebSocket server code, we can achieve efficient communication between NPM and WebSocket. For example, we can use NPM to handle HTTP requests and forward WebSocket requests on specific URLs to the backend WebSocket server. This way, we can use both HTTP and WebSocket under the same domain name, and WebSocket requests can be managed by NPM like other HTTP requests.

To sum up, by properly configuring NPM and implementing the code of the back-end WebSocket server, we can achieve efficient communication between NPM and WebSocket. This allows us to easily handle WebSocket requests while using NPM and implement the real-time communication capabilities required for real-time applications. I hope the code examples and explanations in this article are helpful!

The above is the detailed content of Efficient communication implementation between Nginx Proxy Manager and WebSocket. For more information, please follow other related articles on the PHP Chinese website!