🔬 实验5 — Web框架开发环境搭建与云服务器部署

🏁 实验达成里程碑

完成本次实验后，你将逐步达成以下里程碑。每完成一项，给自己打一个勾！

🛒

里程碑 1：成功购买云服务器 拥有一台属于自己的阿里云 ECS 服务器，记录下公网 IP 地址

🔐

里程碑 2：成功登录服务器 通过 SSH 远程连接到服务器，看到 Linux 命令行终端

🐍

里程碑 3：成功搭建 Python 环境 创建虚拟环境，使用豆瓣源安装 Python 包，pip list 正常显示

🌐

里程碑 4：成功部署 Nginx 在浏览器中通过公网 IP 看到 Nginx 欢迎页面或自定义 HTML 页面

🚀

里程碑 5（拓展）：理解完整部署链路 安装 Gunicorn + Supervisor，理解反向代理与 WSGI 的协作关系

📖 知识速览（课前 10 分钟）

什么是 Web 框架？

📖 定义

Web 框架是一套「预制工具包」，帮你把建网站中最重复、最麻烦的事情（路由管理、数据库操作、页面渲染、会话管理等）提前做好了，你只需要专注写业务逻辑。

💬 人话翻译

就像装修房子时，你不需要自己烧砖、做水泥——框架就是「精装修套餐」，给你一个可以直接入住的基础结构，你只管摆家具。

MVC 模式一句话

Model（数据层）管数据，View（视图层）管展示，Controller（控制层）管调度。三者分离，各司其职。

主流 Python Web 框架

框架	特点	适用场景
Django	大而全，自带 ORM、Admin 后台	中大型项目、企业级应用
Flask	小而美，灵活轻量	小型项目、API 开发、学习入门
Tornado	异步非阻塞	高并发、长连接（聊天室等）
FastAPI	现代、高性能、自动文档	API 开发、微服务

部署链路一览

浏览器请求

→

Nginx
反向代理

→

Gunicorn
WSGI 服务器

→

Flask/Django
Web 应用

💬 人话翻译

Nginx 就像饭店的前台接待——把客人的需求（请求）分发给后厨（Gunicorn）。Gunicorn 是个管理员，把订单递给具体做菜的厨师（你的 Python 应用）。Supervisor 是老板，确保厨师不会偷偷下班（进程守护）。

🛒 任务一：购买阿里云 ECS 服务器

步骤 1.1 ⭐ 基础

打开阿里云官网 aliyun.com，注册并登录账号（支持支付宝快捷登录）。

💡 提示

学生可以使用学生优惠或「飞天加速计划」获得免费试用资格。具体入口：
控制台 → 搜索「云服务器 ECS」→ 查看是否有试用/学生优惠活动。

步骤 1.2 ⭐ 基础

选择 ECS 云服务器配置，按以下推荐配置购买：

配置项	推荐值	说明
地域	华南（广州）或就近选择	离你越近速度越快
实例规格	ecs.t6-c1m1.large 或 1核2G	学习用足够
操作系统	Ubuntu 22.04 LTS	推荐使用 Ubuntu，教程兼容性好
系统盘	40GB 高效云盘	默认即可
带宽	1-5Mbps 按流量计费	学习用足够
安全组	开放 22、80、443 端口	SSH + HTTP + HTTPS

⚠️ 注意

购买时务必设置 root 密码（或上传 SSH 密钥）！忘记密码需要到控制台重置。
安全组必须放通 22 端口（SSH）和 80 端口（HTTP），否则无法远程连接和访问网页。

步骤 1.3 ⭐ 基础

购买完成后，进入「ECS 管理控制台」→「实例列表」，记录下你的：

🎯 达成标准：能看到实例状态为「运行中」，并记录下 公网 IP 地址（如 47.xxx.xxx.xxx）

🔐 任务二：远程登录 Linux 服务器

步骤 2.1 ⭐ 基础

使用 SSH 工具连接到你的服务器。

方式一：使用终端命令（Mac/Linux/Windows PowerShell）

BASH

# 将 你的公网IP 替换为你实际的 IP 地址
ssh root@你的公网IP

首次连接会提示确认指纹，输入 yes 后回车，然后输入密码即可。

方式二：使用阿里云网页版终端

在 ECS 控制台 → 实例列表 → 点击「远程连接」→ 选择「Workbench远程连接」，直接在浏览器中操作。

方式三：使用 SSH 客户端（Windows 推荐）

下载 MobaXterm 或 XShell，填写主机地址（公网 IP）、端口（22）、用户名（root）和密码即可连接。

🎯 达成标准：看到类似 root@iZxxx:~# 的命令行提示符，说明登录成功

步骤 2.2 ⭐ 基础

登录成功后，先确认 Python 版本：

BASH

# 查看 Python3 版本
python3 --version

# 查看系统信息
cat /etc/os-release

✅ 预期输出

Python 3.10.x（Ubuntu 22.04 自带 Python 3.10）

💡 提示

如果显示 command not found，运行 sudo apt update && sudo apt install python3 -y 安装。

步骤 2.3 ⭐ 基础

如果忘记密码，可以在控制台重置：

ECS 控制台 → 实例列表 → 更多 → 密码/密钥 → 重置实例密码 → 重启实例后生效。

🐍 任务三：搭建 Python 开发环境

步骤 3.1 ⭐ 基础

安装 pip 包管理工具

BASH

# 更新系统包列表
sudo apt update

# 安装 pip3
sudo apt install python3-pip -y

# 查看 pip 版本
pip3 --version

✅ 预期输出

pip 22.x.x from /usr/lib/python3/dist-packages/pip (python 3.10)

步骤 3.2 ⭐ 基础

配置国内镜像源（豆瓣源），加速 pip 下载

💬 为什么要换源？

pip 默认从国外的 PyPI 服务器下载包，在国内速度很慢甚至超时。把源换成豆瓣（douban）的国内镜像，速度能快 10-50 倍。

BASH

# 方式一：临时使用豆瓣源安装某个包
pip3 install flask -i https://pypi.doubanio.com/simple/ --trusted-host pypi.doubanio.com

# 方式二：永久配置豆瓣源（推荐）
mkdir -p ~/.pip
cat > ~/.pip/pip.conf << 'EOF'
[global]
index-url = https://pypi.doubanio.com/simple/
trusted-host = pypi.doubanio.com
EOF

# 验证配置是否生效
pip3 config list

💡 其他常用国内镜像源

清华源：https://pypi.tuna.tsinghua.edu.cn/simple/
阿里源：https://mirrors.aliyun.com/pypi/simple/
中科大源：https://pypi.mirrors.ustc.edu.cn/simple/

步骤 3.3 ⭐ 基础

安装虚拟环境工具并创建虚拟环境

💬 什么是虚拟环境？

虚拟环境就像给每个项目单独建一个「沙盒」——项目 A 用 Flask 2.0，项目 B 用 Flask 3.0，互不干扰。没有虚拟环境，所有项目共享同一套包，一旦升级就可能搞崩别的项目。

BASH

# 安装 venv 模块（Ubuntu 需要单独安装）
sudo apt install python3-venv -y

# 创建项目目录
mkdir -p ~/myproject
cd ~/myproject

# 创建虚拟环境（取名 venv）
python3 -m venv venv

# 激活虚拟环境
source venv/bin/activate

✅ 预期变化

激活成功后，命令行前面会出现 (venv) 前缀，表示你已在虚拟环境中：
(venv) root@iZxxx:~/myproject#

⚠️ 注意

每次重新登录服务器后，虚拟环境不会自动激活，需要重新运行：
cd ~/myproject && source venv/bin/activate

步骤 3.4 ⭐ 基础

在虚拟环境中安装 Python 包

BASH

# 确保已激活虚拟环境（看到 (venv) 前缀）

# 安装 Flask 框架
pip install flask

# 安装 beautifultable（终端表格美化工具，课本示例）
pip install beautifultable

# 查看已安装的所有包
pip list

# 查看 pip 版本
pip --version

✅ 预期输出（pip list 部分）

Package         Version
--------------  -------
beautifultable  1.1.0
Flask           3.x.x
pip             2x.x.x
...

🎯 达成标准：pip list 中能看到 Flask 和 beautifultable 已安装

步骤 3.5 ⭐ 基础

退出虚拟环境

BASH

# 退出虚拟环境
deactivate

# 此时 (venv) 前缀消失，回到系统全局环境

🌐 任务四：安装 Nginx 并访问网页

步骤 4.1 ⭐⭐ 提高

安装并启动 Nginx

💬 什么是 Nginx？

Nginx（读音：engine-x）是一个高性能的 Web 服务器和反向代理服务器。在部署链路中，它负责接收用户的浏览器请求，把静态文件（HTML、图片、CSS）直接返回，把动态请求转发给后端应用。

BASH

# 安装 Nginx
sudo apt install nginx -y

# 启动 Nginx
sudo systemctl start nginx

# 设置开机自启
sudo systemctl enable nginx

# 检查 Nginx 状态
sudo systemctl status nginx

✅ 预期输出

看到 active (running) 字样，表示 Nginx 正在运行。

步骤 4.2 ⭐⭐ 提高

在浏览器中访问公网 IP

打开你电脑的浏览器，在地址栏输入：

URL

http://你的公网IP

🎯 达成标准：浏览器显示 Welcome to nginx! 欢迎页面

❌ 常见问题

如果打不开，检查以下几项：
① 安全组是否放通了 80 端口（入方向规则）
② Nginx 是否确实在运行（sudo systemctl status nginx）
③ 是否使用了 http:// 而不是 https://

步骤 4.3 ⭐⭐ 提高

部署自定义 HTML 页面

BASH

# Nginx 默认网站根目录在 /var/www/html/
# 创建一个自定义页面
cat > /var/www/html/hello.html << 'EOF'
<!DOCTYPE html>
<html>
<head>
    <meta charset="UTF-8">
    <title>我的第一个云端页面</title>
    <style>
        body {
            display: flex;
            justify-content: center;
            align-items: center;
            min-height: 100vh;
            font-family: sans-serif;
            background: linear-gradient(135deg, #667eea, #764ba2);
            color: white;
            text-align: center;
        }
        h1 { font-size: 3rem; margin-bottom: 1rem; }
        p { font-size: 1.2rem; opacity: 0.9; }
    </style>
</head>
<body>
    <div>
        <h1>🎉 恭喜！部署成功！</h1>
        <p>这是我在云服务器上的第一个网页</p>
        <p>—— 你的名字 & 日期</p>
    </div>
</body>
</html>
EOF

然后在浏览器中访问：

URL

http://你的公网IP/hello.html

🎯 达成标准：浏览器显示紫色渐变背景和「🎉 恭喜！部署成功！」字样

🚀 拓展任务：完整部署链路（选做）

步骤 5.1 ⭐⭐⭐ 拓展

创建一个最简 Flask 应用并用 Gunicorn 运行

BASH

# 进入项目目录并激活虚拟环境
cd ~/myproject
source venv/bin/activate

# 安装 Gunicorn
pip install gunicorn

# 创建一个最简 Flask 应用
cat > app.py << 'EOF'
from flask import Flask
app = Flask(__name__)

@app.route('/')
def hello():
    return '<h1>Hello from Flask + Gunicorn!</h1>'

if __name__ == '__main__':
    app.run()
EOF

# 用 Gunicorn 启动（绑定到 8000 端口）
gunicorn -w 2 -b 0.0.0.0:8000 app:app

💡 参数说明

-w 2 表示启动 2 个 worker 进程
-b 0.0.0.0:8000 表示监听所有网络接口的 8000 端口
app:app 表示从 app.py 文件中导入名为 app 的 Flask 实例

在浏览器访问 http://你的公网IP:8000（记得在安全组放通 8000 端口）

步骤 5.2 ⭐⭐⭐ 拓展

安装 Supervisor 守护进程

BASH

# 安装 Supervisor
sudo apt install supervisor -y

# 启动 Supervisor
sudo systemctl start supervisor
sudo systemctl enable supervisor

# 查看状态
sudo systemctl status supervisor

💬 Supervisor 有什么用？

当你关闭 SSH 终端后，手动启动的 Gunicorn 进程就会退出。Supervisor 能让 Gunicorn 在后台持续运行，即使意外崩溃也能自动重启，就像给你的应用请了一个 24 小时保安。

步骤 5.3 ⭐⭐⭐ 拓展

理解正向代理 vs 反向代理

	正向代理	反向代理
代理谁	代理客户端（用户）	代理服务器
生活类比	你让朋友帮你买东西（商家不知道你是谁）	114 电话转接到具体科室（你不知道是哪个医生接的）
典型场景	科学上网、公司内网代理	Nginx 将请求转发给后端应用
谁知道谁	服务器不知道真正的客户端	客户端不知道真正的服务器

📋 Linux 常用命令速查表

命令	作用	示例
`python3 --version`	查看 Python 版本	`Python 3.10.12`
`pip3 --version`	查看 pip 版本	`pip 22.0.2`
`pip install 包名`	安装 Python 包	`pip install flask`
`pip list`	查看所有已安装的包	显示包名和版本号列表
`python3 -m venv venv`	创建虚拟环境	在当前目录创建 venv 文件夹
`source venv/bin/activate`	激活虚拟环境	命令行出现 `(venv)` 前缀
`deactivate`	退出虚拟环境	`(venv)` 前缀消失
`sudo systemctl start nginx`	启动 Nginx	—
`sudo systemctl status nginx`	查看 Nginx 状态	显示 active (running)
`cat /etc/os-release`	查看系统信息	显示 Ubuntu 版本

✅ 实验完成检查

对照下面的清单，逐一确认你已经完成了哪些任务：

完成进度：0 / 12

📝 本章小结

📋 小结

本次实验围绕 Web 框架开发环境搭建展开，从购买云服务器开始，逐步完成了远程登录、Python 环境搭建（pip 安装、镜像源配置、虚拟环境创建）和 Nginx 部署。你已经拥有了一台可以通过公网访问的服务器——这是后续学习 Flask/Django Web 开发的基础。将项目部署到云服务器是本章的难点，建议先在本地测试开发，最后再学习云端部署。