百度360必应搜狗淘宝本站头条
当前位置:网站首页 > 技术分类 > 正文

11《Nginx 入门教程》Nginx反向代理(下)

ztj100 2025-04-06 00:44 13 浏览 0 评论

本小节,我们继续学习 Nginx 在 七层反向代理中的其它几种比较常见的情况,比如 web 服务中的 WebSocket 协议的反向代理和 uwsgi 协议的反向代理。

1. WebSocket的反向代理

WebSocket 是目前比较成熟的技术了, WebSocket 协议为创建客户端和服务器端需要实时双向通讯的 webapp 提供了一个选择。服务器可以向浏览器推送相关消息,这样在前端实现的某个页面中我们可以及时看到服务器的状态变化而不用使用定时刷新去获取后台信息。目前大部分浏览器都支持 WebSocket 协议,比如 Firefox,IE,Chrome,Safari,Opera,并且越来越多的服务器框架现在也同样支持 WebSocket。此外,在js、java 和 python 中都提供了 Websocket 开发库,这也使得 websocket 协议的广泛应用于 web 服务的开发中。当然作为浏览器和后台服务的中间代理的 Nginx 也必定支持 Websocket,这样能更好的完成代理角色。在 Nginx 中通过 ngx_http_proxy_module 模块实现 Websocket 反向代理功能,具体实现配置如下:

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

上述配置表示将转发的协议提升至1.1, 同时在转发的 http 请求的头部中加上如下配置:

Upgrade: websocket
Connection: upgrade
代码块12

这两个字段表示请求服务器升级协议为 WebSocket。上游服务器处理完请求后,响应如下报文:

HTTP/1.1 101 Switching Protocols
Upgrade: websocket
Connection: upgrade

这个响应是告诉客户端已成功切换协议,升级为 Websocket 协议。握手成功之后,服务器端和客户端便角色对等,就像普通的 Socket 一样,能够双向通信。 不再进行 HTTP 的交互,而是开始 WebSocket 的数据帧协议实现数据交换。默认情况下,连接将会在无数据传输60秒后关闭,proxy_read_timeout 参数可以延长这个时间。源站通过定期发送 ping 帧以保持连接并确认连接是否还在使用。

通过以上简简单单的三行配置,我们就能在 Nginx 中轻松实现 Websocket 的反向代理,这也说明了 Nginx 的简单易用特点。

2. uwsgi的反向代理

首先,理清楚几个概念:

  • WSGI:全称是 Web Server Gateway Interface,WSGI 只是一种规范,描述 web server 如何与 web application 通信的规范。要实现 WSGI 协议,必须同时实现 web server 和 web application,当前运行在 WSGI 协议之上的 web 框架有 Flask, Django,这也是目前最流行的 python web框架。
  • uwsgi:与WSGI一样是一种通信协议,是uWSGI服务器的独占协议,用于定义传输信息的类型(type of information),每一个uwsgi packet前4byte为传输信息类型的描述。
  • uWSGI:是一个web服务器,实现了WSGI协议、uwsgi协议、http协议等。

WSGI 协议其实是定义了一种 server 与 application 解耦的规范,即可以有多个实现 WSGI server 的服务器,也可以有多个实现 WSGI application 的框架,那么就可以选择任意的 server 和 application 组合实现自己的 web 应用。Django,Flask 框架都有自己实现的简单的WSGI server,一般用于服务器调试,生产环境下直接使用WSGI server。

Nginx 中将 http 协议的报文转换成 uwsgi 协议的报文,只需要使用 uwsgi_pass 指令即可。和 proxy_pass 指令类似,前者转发为 uwsgi 协议的报文,后者代理转发 http 协议的报文。其余用法一致。

Syntax: uwsgi_pass [protocol://]address;
Default: —
Context: location, if in location

用法示例:

...

http {
    ...
    server {
        listen 9000;
        
        location / {
            # 包含uwsgi请求描述文件
            include uwsgi_params;
            # 配置请求传递,socket地址
            uwsgi_pass 127.0.0.1:9000;
        }
    }
    ...
}
...

3. 案例测试

3.1 Websocket 反向代理

我们打开百度搜索"websocket在线测试",找到 websocket 的在线测试网站。

可以看到 121.40.165.18:8800 是该网站提供 websocket 连接的后端服务地址。我们借助这个地址来完成一个简单的测试。我们找一台公网上的云主机,其 ip 地址为 180.76.152.113,在上面搭建 Nginx 服务,添加监听9000端口的服务配置如下:

...
http {
    ...
    
    server {
        listen 9000;
        default_type text/plain;
        access_log logs/ws.log;
        location / {
           proxy_http_version 1.1;
           proxy_set_header Upgrade $http_upgrade;
           proxy_set_header Connection "upgrade";
           proxy_pass http://121.40.165.18:8800;
        }
    }
    
    ...
}
...

然后我们将 websocket 在线测试网站中的测试地址改成 ws://180.76.152.113:9000,断开后再次连接,发现也能成功,同时能实现原服务的功能。这说明我们的 Nginx 服务成功完成了 Websocket 代理功能。

3.2 uwsgi协议的反向代理

本次实验按照如下步骤进行:

  • 首先我们安装 WSGI server,直接使用 pip 安装即可:
pip install uwsgi -i https://pypi.tuna.tsinghua.edu.cn/simple
  • 编写test.py文件:
def application(env, start_response):
    start_response('200 OK', [('Content-Type', 'text/html')])
    return [b'hello world\n',]
  • 启动 WSGI server并监听7000端口。
# 指定socket连接,监听端口,应用代码文件以及进程数
$ uwsgi --socket :7000 --wsgi-file test.py --master --processes 4
  • 在nginx.conf中添加如下 server 指令块:
server {
    listen 7001;
    default_type text/plain;
    access_log logs/uwsgi.log;
    location / {
        include uwsgi_params;
        uwsgi_pass 127.0.0.1:7000;
    }
}

  • 最后在本地可以请求 Nginx 服务地址的7001端口,可以看到返回 “hello world” 字符串,说明 Nginx 转发 uwsgi 协议成功。
[shen@shen ~]$ curl http://180.76.152.113:7001
hello world



相关推荐

Vue 技术栈(全家桶)(vue technology)

Vue技术栈(全家桶)尚硅谷前端研究院第1章:Vue核心Vue简介官网英文官网:https://vuejs.org/中文官网:https://cn.vuejs.org/...

vue 基础- nextTick 的使用场景(vue的nexttick这个方法有什么用)

前言《vue基础》系列是再次回炉vue记的笔记,除了官网那部分知识点外,还会加入自己的一些理解。(里面会有部分和官网相同的文案,有经验的同学择感兴趣的阅读)在开发时,是不是遇到过这样的场景,响应...

vue3 组件初始化流程(vue组件初始化顺序)

学习完成响应式系统后,咋们来看看vue3组件的初始化流程既然是看vue组件的初始化流程,咋们先来创建基本的代码,跑跑流程(在app.vue中写入以下内容,来跑流程)...

vue3优雅的设置element-plus的table自动滚动到底部

场景我是需要在table最后添加一行数据,然后把滚动条滚动到最后。查网上的解决方案都是读取html结构,暴力的去获取,虽能解决问题,但是不喜欢这种打补丁的解决方案,我想着官方应该有相关的定义,于是就去...

Vue3为什么推荐使用ref而不是reactive

为什么推荐使用ref而不是reactivereactive本身具有很大局限性导致使用过程需要额外注意,如果忽视这些问题将对开发造成不小的麻烦;ref更像是vue2时代optionapi的data的替...

9、echarts 在 vue 中怎么引用?(必会)

首先我们初始化一个vue项目,执行vueinitwebpackechart,接着我们进入初始化的项目下。安装echarts,npminstallecharts-S//或...

无所不能,将 Vue 渲染到嵌入式液晶屏

该文章转载自公众号@前端时刻,https://mp.weixin.qq.com/s/WDHW36zhfNFVFVv4jO2vrA前言...

vue-element-admin 增删改查(五)(vue-element-admin怎么用)

此篇幅比较长,涉及到的小知识点也比较多,一定要耐心看完,记住学东西没有耐心可不行!!!一、添加和修改注:添加和编辑用到了同一个组件,也就是此篇文章你能学会如何封装组件及引用组件;第二能学会async和...

最全的 Vue 面试题+详解答案(vue面试题知识点大全)

前言本文整理了...

基于 vue3.0 桌面端朋友圈/登录验证+60s倒计时

今天给大家分享的是Vue3聊天实例中的朋友圈的实现及登录验证和倒计时操作。先上效果图这个是最新开发的vue3.x网页端聊天项目中的朋友圈模块。用到了ElementPlus...

不来看看这些 VUE 的生命周期钩子函数?| 原力计划

作者|huangfuyk责编|王晓曼出品|CSDN博客VUE的生命周期钩子函数:就是指在一个组件从创建到销毁的过程自动执行的函数,包含组件的变化。可以分为:创建、挂载、更新、销毁四个模块...

Vue3.5正式上线,父传子props用法更丝滑简洁

前言Vue3.5在2024-09-03正式上线,目前在Vue官网显最新版本已经是Vue3.5,其中主要包含了几个小改动,我留意到日常最常用的改动就是props了,肯定是用Vue3的人必用的,所以针对性...

Vue 3 生命周期完整指南(vue生命周期及使用)

Vue2和Vue3中的生命周期钩子的工作方式非常相似,我们仍然可以访问相同的钩子,也希望将它们能用于相同的场景。...

救命!这 10 个 Vue3 技巧藏太深了!性能翻倍 + 摸鱼神器全揭秘

前端打工人集合!是不是经常遇到这些崩溃瞬间:Vue3项目越写越卡,组件通信像走迷宫,复杂逻辑写得脑壳疼?别慌!作为在一线摸爬滚打多年的老前端,今天直接甩出10个超实用的Vue3实战技巧,手把...

怎么在 vue 中使用 form 清除校验状态?

在Vue中使用表单验证时,经常需要清除表单的校验状态。下面我将介绍一些方法来清除表单的校验状态。1.使用this.$refs...

取消回复欢迎 发表评论: