Nginx reverse proxy Websocket configuration tutorial to achieve real-time communication

Nginx reverse proxy Websocket configuration tutorial to achieve real-time communication

Websocket is a protocol based on long connections that can achieve real-time communication. Combined with the function of Nginx reverse proxy, it can better manage and distribute Websocket request. This article will introduce how to configure Nginx reverse proxy to implement Websocket real-time communication.

1. Confirm Nginx is installed
   First, make sure Nginx is installed on the server. If it is not installed, you can use the following command to install it:

   sudo apt-get update
   sudo apt-get install nginx

2. Modify Nginx configuration file
   Use a text editor to open the Nginx configuration file, usually located at /etc/nginx/ nginx.conf or /etc/nginx/conf.d/default.conf. Modify as follows:

   server {
   listen 80;
   server_name yourdomain.com;
   
   location /websocket {
      proxy_pass http://backend;
      proxy_http_version 1.1;
      proxy_set_header Upgrade $http_upgrade;
      proxy_set_header Connection "Upgrade";
   }
   }

   In the above configuration, we define a location named websocket and proxy the request to a location named backend's backend server. Note that yourdomain.com and backend should be replaced with your own domain name and backend server address.

In addition, we also set two proxy request headers, Upgrade and Connection, to enable Nginx to correctly handle Websocket connections.

3. Restart Nginx
   After completing the modification of the configuration file, save and exit the text editor. Then restart Nginx using the following command:

   sudo service nginx restart

4. Test Websocket Connection
   Now you can use any client application that supports the Websocket protocol (such as a browser or terminal tool) to test your Websocket server . Assuming your domain name is yourdomain.com, use the following code to test:

const socket = new WebSocket('ws://yourdomain.com/websocket');

socket.onopen = () => {
   console.log('连接已建立');
};

socket.onmessage = (event) => {
   console.log('收到消息:', event.data);
};

socket.onclose = () => {
   console.log('连接已关闭');
};

socket.onerror = (error) => {
   console.error('发生错误:', error);
};

Paste the above code into an environment that supports JavaScript and run it, such as a browser developer Tools console, or run using Node.js. If you can see the connection established log, your Nginx configuration and Websocket server are working properly.

Summary
Through the configuration of Nginx reverse proxy, we can proxy Websocket requests to the back-end server, thereby realizing the real-time communication function. This article explains how to configure Nginx and then use JavaScript code to test Websocket connections. I hope this article will help you understand and apply Nginx reverse proxy Websocket.

The above is the detailed content of Nginx reverse proxy Websocket configuration tutorial to achieve real-time communication. For more information, please follow other related articles on the PHP Chinese website!