https://www.nginx.com/blog/websocket-nginx/

 

NGINX as a WebSocket Proxy

The WebSocket protocol provides a way of creating web applications that support real‑time bidirectional communication between clients and servers. Part of HTML5, WebSocket makes it much easier to develop these types of applications than the methods previously available. Most modern browsers support WebSocket including Chrome, Firefox, Internet Explorer, Opera, and Safari, and more and more server application frameworks are now supporting WebSocket as well.

For enterprise production use, where multiple WebSocket servers are needed for performance and high availability, a load balancing layer that understands the WebSocket protocol is required, and NGINX has supported WebSocket since version 1.3 and can act as a reverse proxy and do load balancing of WebSocket applications. (All releases of NGINX Plus also support WebSocket.)

Check out recent performance tests on the scalability of NGINX to load balance WebSocket connections.

The WebSocket protocol is different from the HTTP protocol, but the WebSocket handshake is compatible with HTTP, using the HTTP Upgrade facility to upgrade the connection from HTTP to WebSocket. This allows WebSocket applications to more easily fit into existing infrastructures. For example, WebSocket applications can use the standard HTTP ports 80 and 443, thus allowing the use of existing firewall rules.

A WebSocket application keeps a long‑running connection open between the client and the server, facilitating the development of real‑time applications. The HTTP Upgrade mechanism used to upgrade the connection from HTTP to WebSocket uses the Upgrade and Connection headers. There are some challenges that a reverse proxy server faces in supporting WebSocket. One is that WebSocket is a hop‑by‑hop protocol, so when a proxy server intercepts an Upgrade request from a client it needs to send its own Upgrade request to the backend server, including the appropriate headers. Also, since WebSocket connections are long lived, as opposed to the typical short‑lived connections used by HTTP, the reverse proxy needs to allow these connections to remain open, rather than closing them because they seem to be idle.

NGINX supports WebSocket by allowing a tunnel to be set up between a client and a backend server. For NGINX to send the Upgrade request from the client to the backend server, the Upgrade and Connection headers must be set explicitly, as in this example:

location /wsapp/ {
proxy_pass http://wsbackend;
proxy_http_version 1.1;
proxy_set_header Upgrade $http_upgrade;
proxy_set_header Connection "Upgrade";
}

Once this is done, NGINX deals with this as a WebSocket connection.

NGINX Websocket Example

Here is a live example to show NGINX working as a WebSocket proxy. This example uses ws, a WebSocket implementation built on Node.js. NGINX acts as a reverse proxy for a simple WebSocket application utilizing ws and Node.js. These instructions have been tested with Ubuntu 13.10 and CentOS 6.5 but might need to be adjusted for other OSs and versions. For this example, the WebSocket server’s IP address is 192.168.100.10 and the NGINX server’s IP address is 192.168.100.20.

  1. If you don’t already have Node.js and npm installed, run the following command:

    • For Debian and Ubuntu:

      $ sudo apt-get install nodejs npm
    • For RHEL and CentOS:

      $ sudo yum install nodejs npm
  2. Node.js is installed as nodejs on Ubuntu and as node on CentOS. The example uses node, so on Ubuntu we need to create a symbolic link from nodejs to node:

    $ ln -s /usr/bin/nodejs /usr/local/bin/node
  3. To install ws, run the following command:

    $ sudo npm install ws

    Note: If you get the error message: “Error: failed to fetch from registry: ws”, run the following command to fix the problem:

    $ sudo npm config set registry http://registry.npmjs.org/

    Then run the sudo npm install ws command again.

  4. ws comes with the program /root/node_modules/ws/bin/wscat that we will use for our client, but we need to create a program to act as the server. Create a file called server.js with these contents:

    console.log("Server started");
    var Msg = '';
    var WebSocketServer = require('ws').Server
    , wss = new WebSocketServer({port: 8010});
    wss.on('connection', function(ws) {
    ws.on('message', function(message) {
    console.log('Received from client: %s', message);
    ws.send('Server received from client: ' + message);
    });
    });
  5. To execute the server program, run the following command:
    $ node server.js
  6. The server prints an initial "Server started" message and then listens on port 8010, waiting for a client to connect to it. When it receives a client request, it echoes it and sends a message back to the client containing the message it received. To have NGINX proxy these requests, we create the following configuration:

    http {
    map $http_upgrade $connection_upgrade {
    default upgrade;
    '' close;
    } upstream websocket {
    server 192.168.100.10:8010;
    } server {
    listen 8020;
    location / {
    proxy_pass http://websocket;
    proxy_http_version 1.1;
    proxy_set_header Upgrade $http_upgrade;
    proxy_set_header Connection $connection_upgrade;
    }
    }
    }

    NGINX listens on port 8020 and proxies requests to the backend WebSocket server. The proxy_set_header directives enable NGINX to properly handle the WebSocket protocol.

  7. To test the server, we run wscat as our client:

    $ /root/node_modules/ws/bin/wscat --connect ws://192.168.100.20:8020

    wscat connects to the WebSocket server through the NGINX proxy. When you type a message for wscat to send to the server, you see it echoed on the server and then a message from the server appears on the client. Here’s a sample interaction:

    Server: Client:
    $ node server.js 
    Server started
     
     
     
     
     
    wscat --connect ws://192.168.100.20:8020
    Connected (press CTRL+C to quit)
    > Hello
    Received from client: Hello  
      < Server received from client: Hello

    Here we see that the client and server are able to communicate
    through NGINX which is acting as a proxy and messages can continue to be
    sent back and forth until either the client or server disconnects. All
    that is needed to get NGINX to properly handle WebSocket is to set the
    headers correctly to handle the Upgrade request that upgrades the
    connection from HTTP to WebSocket.

Nginx反向代理websocket配置实例(官网)的更多相关文章

  1. Nginx反向代理websocket配置实例

    最近有一个需求,就是需要使用 nginx 反向代理 websocket,经过查找一番资料,目前已经测试通过,本文只做一个记录 复制代码 代码如下: 注: 看官方文档说 Nginx 在 1.3 以后的版 ...

  2. NGINX: 反向代理 websocket

    参考: [ Using multiple nodes ] [ Nginx 官网 WebSocket proxying ] 关于 websocket 的介绍可以看阮大大的这篇 [ WebSocket 教 ...

  3. Centos7 nginx 反向代理的配置

    一.正向代理与反向代理 1.正向代理 正向代理往VPN理解 正向代理,也就是传说中的代理,他的工作原理就像一个跳板(VPN),简单的说: 我是一个用户,我访问不了某网站,但是我能访问一个代理服务器,这 ...

  4. Nginx反向代理的配置

    Chapter: Nginx基本操作释疑 1. Nginx的端口修改问题 2. Nginx 301重定向的配置 3. Windows下配置Nginx使之支持PHP 4. Linux下配置Nginx使之 ...

  5. nginx反向代理的配置优化

    作者:守住每一天 blog:liuyu.blog.51cto.combbs:bbs.linuxtone.orgmsn:liuyubj520#hotmail.comemail:liuyu105#gmai ...

  6. 【netcore基础】CentOS 7.6.1810 搭建.net core 2.1 linux 运行环境 nginx反向代理 supervisor配置自启动

    之前写过一篇Ubuntu的环境搭建博客,感觉一些配置大同小异,这里重点记录下 nginx 作为静态 angular 项目文件服务器的配置 参考链接 [netcore基础]ubuntu 16.04 搭建 ...

  7. 配置Nginx反向代理WebSocket,以代理noVNC为例

    什么是Nginx Nginx (engine x) 是一个高性能的HTTP和反向代理服务器,也是一个IMAP/POP3/SMTP服务器. Nginx是一款轻量级的Web 服务器/反向代理服务器及电子邮 ...

  8. 配置 Nginx 反向代理 WebSocket

    用Nginx给网站做反向代理和负载均衡是广泛使用的一种Web服务器部署技术.不仅能够保证后端服务器的隐蔽性,还可以提高网站部署灵活性. 今天我们来讲一下,如何用Nginx给WebSocket服务器实现 ...

  9. [svc]tomcat目录结构/虚拟主机/nginx反向代理cache配置

    tomcat目录文件 /usr/local/tomcat/bin/catalina.sh stop sleep 3 /usr/local/tomcat/bin/catalina.sh start to ...

随机推荐

  1. UnicodeDecodeError: 'ascii' codec can't decode byte 0xe7 in position 0: ordinal not in range(128)的解决

    在用爬虫爬取网络小说的时候出现该问题. 估计是字符格式转换格式的错误. 暂时无法解决,搜索了其他博主的解决方案. 以下两个方案靠谱: <一>适用于全篇 import sys default ...

  2. Beta发布 _thunder_文案+美工展示

    作业要求:https://edu.cnblogs.com/campus/nenu/SWE2017FALL/homework/1366 团队介绍:thunder 组成员及各位博客地址: 1.王航:htt ...

  3. 个人作业Week7

    1.在做个人项目的时候,由于很久都没有写这么大的程序了,对程序的感觉还没有恢复,因此,没能完全完成个人项目.现在回去看个人项目的代码(针对完成的代码来看),完全就是一个大泥球,代码的结构性太差,基本上 ...

  4. eclipse自动生成uml

    见如下链接: https://blog.csdn.net/zyf_balance/article/details/44937197 若eclipse无法生成,可以安装myeclipse使用自带的方法: ...

  5. 在Windows下制作静态库和动态库

    一:静态库的创建 VC++6.0中new一个的为win32 static library工程,之后有二个选项.根据需求选吧. 具体的类或者函数的添加过程和标准的工程一样,直接创建新的类或者添加新 的. ...

  6. 判断二叉树B是否是树A的子树

    如下图所示,则认为树B是树A的子树. 代码如下: /** public class TreeNode { int val = 0; TreeNode left = null; TreeNode rig ...

  7. 结对编程:四则运算。组员:闫浩楠 杨钰宁 开发语言:C语言

    需求分析:1.能够自动出题并给出答案 2.包含“+,—,*,/,()” 的四则运算. 3.显示题目的答案 结构设计:1.自动出题用随机数生成语句实现:包括随机生成数字.运算符号和题目长度 2.用变量约 ...

  8. Vue.js——60分钟browserify项目模板快速入门

    概述 在之前的一系列vue.js文章,我们都是用传统模式引用vue.js以及其他的js文件的,这在开发时会产生一些问题. 首先,这限定了我们的开发模式是基于页面的,而不是基于组件的,组件的所有代码都直 ...

  9. xpath 去除空格

    normalize,字面意思就是正规化 加入space  大概意思就是空格的处理了 官方解释是这样的: 通过去掉前导和尾随空白并使用单个空格替换一系列空白字符,使空白标准化.如果省略了该参数,上下文节 ...

  10. js & auto copy

    js & auto copy https://developer.mozilla.org/zh-CN/docs/Web/Events/copy Ctrl + C Command + C doc ...