Nginx+Gunicorn云部署（全栈部署云服务器）

LAOLONG-C

1056人浏览 · 2025-09-21 12:29:40

LAOLONG-C · 2025-09-21 12:29:40 发布

Ubuntu 24.04 部署 Vue3+Django5.0 完整流程（Nginx+Gunicorn+MySQL）

一、服务器初始化

连接服务器

首次登录（替换为你的服务器IP）

ssh root@1.2.3.4

建议创建普通用户（可选，增强安全性）

adduser deploy # 按提示设置密码和信息
usermod -aG sudo deploy # 赋予sudo权限
su - deploy # 切换到普通用户

系统更新与基础工具安装

更新系统包

sudo apt update && sudo apt upgrade -y

安装必备工具

sudo apt install -y wget vim net-tools curl ufw git build-essential

防火墙配置

启用防火墙

sudo ufw enable

开放必要端口

sudo ufw allow 22/tcp # SSH
sudo ufw allow 80/tcp # HTTP
sudo ufw allow 443/tcp # HTTPS（可选）
sudo ufw allow 8000/tcp # 后端测试端口

查看防火墙状态

sudo ufw status

二、MySQL 数据库安装与配置

安装 MySQL 8.0

安装MySQL服务器

sudo apt install -y mysql-server

启动服务并设置开机自启

sudo systemctl start mysql
sudo systemctl enable mysql

查看服务状态（确保显示active (running)）

sudo systemctl status mysql

安全初始化 MySQL

运行安全脚本（按提示操作：设置root密码、移除匿名用户等）

sudo mysql_secure_installation

登录MySQL（输入刚设置的root密码）

sudo mysql -u root -p

创建数据库和用户
在 MySQL 终端执行以下命令（替换<数据库名>等占位符）：
– 创建数据库（支持中文）
CREATE DATABASE <数据库名> CHARACTER SET utf8mb4 COLLATE utf8mb4_unicode_ci;

– 创建专用用户
CREATE USER ‘<用户名>’@‘localhost’ IDENTIFIED BY ‘<复杂密码>’;

– 授权用户访问数据库
GRANT ALL PRIVILEGES ON <数据库名>.* TO ‘<用户名>’@‘localhost’;

– 刷新权限
FLUSH PRIVILEGES;

– 退出MySQL
EXIT;

三、Django5.0 后端部署

安装 Python 环境

Ubuntu 24.04默认带Python3.12（满足Django5.0需求）

python3 --version # 确认版本≥3.10

安装Python工具

sudo apt install -y python3-pip python3-venv python3-dev

创建项目目录

mkdir -p /var/www/backend
cd /var/www/backend

上传本地Django项目（本地终端执行，非服务器）

scp -r /本地项目路径/* deploy@1.2.3.4:/var/www/backend

或从Git仓库克隆

git clone <你的仓库地址> .

配置 Python 虚拟环境

创建虚拟环境

python3 -m venv venv

激活虚拟环境（终端会显示(venv)）

source venv/bin/activate

安装后端依赖

安装MySQL依赖（编译mysqlclient需要）

sudo apt install -y libmysqlclient-dev

安装项目依赖

pip install -r requirements.txt

确保关键包版本正确

pip install django==5.0 gunicorn mysqlclient django-cors-headers
这时如果报错缺少依赖就运行
步骤 1：安装系统依赖（关键）
mysqlclient 需要依赖 pkg-config 工具和 MySQL 开发库，用 apt 安装：
bash

更新包列表（需要sudo权限，输入deploy用户的sudo密码）

sudo apt update

安装必要的依赖库

sudo apt install -y pkg-config libmysqlclient-dev

步骤 2：重新安装 mysqlclient 及其他包
依赖安装完成后，回到虚拟环境（已激活），重新执行安装命令：

pip install django==5.0 gunicorn mysqlclient django-cors-headers

原因说明：
mysqlclient 不是纯 Python 包，需要编译 C 扩展，依赖系统中的：
pkg-config：用于检测系统库的配置工具（错误中提示 “pkg-config: not found”）
libmysqlclient-dev：MySQL 的开发文件（包含编译所需的头文件和库）
安装这些系统依赖后，mysqlclient 就能正常编译并安装了。

配置 Django 项目
5.1 修改 settings.py

编辑配置文件（替换为你的项目目录）

vim /var/www/backend/<项目名>/settings.py

关键配置修改：

关闭调试模式

DEBUG = False

允许访问的主机（添加服务器IP）

ALLOWED_HOSTS = [‘1.2.3.4’, ‘localhost’, ‘127.0.0.1’]

跨域配置（允许前端访问）

INSTALLED_APPS = [
# …其他应用
‘corsheaders’, # 添加跨域应用
]

MIDDLEWARE = [
‘corsheaders.middleware.CorsMiddleware’, # 跨域中间件放最前面
# …其他中间件
]

允许的前端域名（替换为你的服务器IP）

CORS_ALLOWED_ORIGINS = [
“http://1.2.3.4”,
]

数据库配置（替换为前面创建的信息）

DATABASES = {
‘default’: {
‘ENGINE’: ‘django.db.backends.mysql’,
‘NAME’: ‘<数据库名>’,
‘USER’: ‘<用户名>’,
‘PASSWORD’: ‘<复杂密码>’,
‘HOST’: ‘localhost’,
‘PORT’: ‘3306’,
‘OPTIONS’: {
‘charset’: ‘utf8mb4’,
}
}
}

静态文件配置

STATIC_URL = ‘/static/’
STATIC_ROOT = ‘/var/www/backend/staticfiles’ # 收集静态文件的目录

媒体文件配置（如果需要上传文件）

MEDIA_URL = ‘/media/’
MEDIA_ROOT = ‘/var/www/backend/media’

5.2 创建静态文件目录
mkdir -p /var/www/backend/staticfiles
mkdir -p /var/www/backend/media

初始化 Django 项目

收集静态文件

python manage.py collectstatic --noinput

数据库迁移

python manage.py makemigrations
python manage.py migrate

创建管理员账户（按提示输入用户名、邮箱、密码）

python manage.py createsuperuser

配置 Gunicorn 服务
7.1 创建系统服务文件
sudo vim /etc/systemd/system/django.service

添加以下内容（替换路径和项目名）：
[Unit]
Description=Gunicorn daemon for Django5.0
After=network.target mysql.service

[Service]
User=root # 确保 root 用户存在（系统默认一定存在）
Group=root # 组和用户一致
WorkingDirectory=/var/www/backend/意见反馈backend/feedback # 你的项目根目录（manage.py 所在处，必须正确）
ExecStart=/var/www/backend/venv/bin/gunicorn --workers 3 --bind 0.0.0.0:8000 feedback.wsgi:application # 启动命令（检查 gunicorn 路径和 WSGI 模块）
Restart=on-failure # 失败时重启（可选，方便排查）

[Install]
WantedBy=multi-user.target

7.2 启动并设置开机自启

刷新系统服务

sudo systemctl daemon-reload

启动Django服务

sudo systemctl start django

设置开机自启

sudo systemctl enable django

查看服务状态（确保active (running)）

sudo systemctl status django

四、Vue3 前端部署

安装 Node.js 环境

安装Node.js 18（Vue3兼容版本）

curl -fsSL https://deb.nodesource.com/setup_18.x | sudo -E bash -
sudo apt install -y nodejs

验证版本

node -v # 应显示v18.x.x
npm -v # 应显示8.x.x以上

创建前端目录

mkdir -p /var/www/frontend
cd /var/www/frontend

上传本地Vue项目（本地终端执行）

scp -r /本地Vue项目路径/* deploy@1.2.3.4:/var/www/frontend

配置前端 API 地址
修改 Vue 项目中 API 请求的基础路径（通常在src/utils/request.js）：
vim /var/www/frontend/src/utils/request.js

关键配置（使用相对路径通过 Nginx 代理）：
import axios from ‘axios’

const service = axios.create({
baseURL: ‘/api’, // 对应Nginx的/api代理配置
timeout: 5000
})

export default service

构建生产版本

安装依赖（如遇权限问题可加–unsafe-perm）

npm install

构建静态文件（生成dist目录）

npm run build

五、Nginx 配置（连接前后端）

安装 Nginx
sudo apt install -y nginx

启动服务并设置开机自启

sudo systemctl start nginx
sudo systemctl enable nginx

查看状态

sudo systemctl status nginx

创建 Nginx 配置文件

创建站点配置

sudo vim /etc/nginx/sites-available/default

替换为以下内容（替换服务器 IP）：
server {
listen 80;
server_name 1.2.3.4; # 你的服务器IP或域名

# 前端静态文件配置
location / {
    root /var/www/frontend/dist;
    index index.html;
    try_files $uri $uri/ /index.html;  # 解决Vue路由刷新404
}

# 后端API代理（匹配前端的/api前缀）
location /api/ {
    proxy_pass http://127.0.0.1:8000/api/;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
    proxy_set_header X-Forwarded-For $proxy_add_x_forwarded_for;
}

# Django管理后台
location /admin/ {
    proxy_pass http://127.0.0.1:8000/admin/;
    proxy_set_header Host $host;
    proxy_set_header X-Real-IP $remote_addr;
}

# Django静态文件
location /static/ {
    alias /var/www/backend/staticfiles/;
    expires 30d;  # 静态文件缓存30天
}

# 媒体文件（如果需要）
location /media/ {
    alias /var/www/backend/media/;
}

}

验证并重启 Nginx

检查配置文件语法

sudo nginx -t

重启Nginx生效

sudo systemctl restart nginx

六、权限与访问测试

确保Nginx能访问文件

sudo chown -R deploy:www-data /var/www/backend
sudo chown -R deploy:www-data /var/www/frontend
sudo chmod -R 755 /var/www

测试访问
前端页面：浏览器访问 http://1.2.3.4（应显示 Vue 页面）
后端接口：通过前端操作测试 API 交互，或直接访问 http://1.2.3.4/api/xxx
Django 管理后台：访问 http://1.2.3.4/admin（用前面创建的超级用户登录）
七、问题排查与日志查看
后端服务问题

查看Django服务日志

sudo journalctl -u django -f # -f实时刷新

查看Gunicorn错误（如果服务启动失败）

/var/www/backend/venv/bin/gunicorn --bind 127.0.0.1:8000 <项目名>.wsgi:application # 直接运行测试

Nginx 问题

查看Nginx错误日志

sudo tail -f /var/log/nginx/error.log

查看访问日志

sudo tail -f /var/log/nginx/access.log

数据库问题

查看MySQL日志

sudo tail -f /var/log/mysql/error.log

测试数据库连接

mysql -u <用户名> -p # 输入密码后能登录则正常

端口占用检查

查看8000端口占用

sudo ss -tulpn | grep 8000

查看80端口占用

sudo ss -tulpn | grep 80

通过以上步骤，可在 Ubuntu 24.04 上完整部署 Vue3 前端和 Django5.0 后端，并通过 Nginx 实现前后端连通。每一步均针对 Ubuntu 系统特性优化，确保兼容性和稳定性。

码道开发者社区

码道开发者社区，聚焦华为云码道 CodeArts 代码智能体，沉淀 Agent、Skill、鸿蒙开发实战内容，供开发者查阅资料、交流技术、分享工程实践

更多推荐

AI 已经能直接改设计稿了:Windows部署Penpot，接入Codex MCP实测

码道开发者社区

【AI 业务流架构师】AI 业务流架构师方法论：Agentic AI 范式转移与业务编排思维

2026 年，Anthropic CEO Dario Amodei 在 Code with Claude 大会上的一个判断广为流传：一个人运营一家十亿美元级公司的概率是 70%–80%。这句话听起来像科幻小说的设定，但它背后是一个正在发生的结构性变化——AI 把"执行"的成本压到了历史低点，同时把"编排"的价值推到了前台。这意味着我们需要一套新的思考框架，来回答两个问题：一个人如何拥有一个公司的产

码道开发者社区

Codex CLI实战从一句模糊需求到可执行可测试可验收的开发任务把“帮我优化一下”变成 Codex 能执行、团队能复核、测试能证明的工程任务

码道开发者社区

所有评论(0)

查看更多评论

LAOLONG-C

@W2799401288

已为社区贡献1条内容

Nginx+Gunicorn云部署（全栈部署云服务器）

LAOLONG-C

Ubuntu 24.04 部署 Vue3+Django5.0 完整流程（Nginx+Gunicorn+MySQL）

首次登录（替换为你的服务器IP）

建议创建普通用户（可选，增强安全性）

更新系统包

安装必备工具

启用防火墙

开放必要端口

查看防火墙状态

安装MySQL服务器

启动服务并设置开机自启

查看服务状态（确保显示active (running)）

运行安全脚本（按提示操作：设置root密码、移除匿名用户等）

登录MySQL（输入刚设置的root密码）

Ubuntu 24.04默认带Python3.12（满足Django5.0需求）

安装Python工具

创建项目目录

上传本地Django项目（本地终端执行，非服务器）

或从Git仓库克隆

git clone <你的仓库地址> .

创建虚拟环境

激活虚拟环境（终端会显示(venv)）

安装MySQL依赖（编译mysqlclient需要）

安装项目依赖

确保关键包版本正确

更新包列表（需要sudo权限，输入deploy用户的sudo密码）

安装必要的依赖库

编辑配置文件（替换为你的项目目录）

关闭调试模式

允许访问的主机（添加服务器IP）

跨域配置（允许前端访问）

允许的前端域名（替换为你的服务器IP）

数据库配置（替换为前面创建的信息）

静态文件配置

媒体文件配置（如果需要上传文件）

收集静态文件

数据库迁移

创建管理员账户（按提示输入用户名、邮箱、密码）

刷新系统服务

启动Django服务

设置开机自启

查看服务状态（确保active (running)）

安装Node.js 18（Vue3兼容版本）

验证版本

创建前端目录

上传本地Vue项目（本地终端执行）

安装依赖（如遇权限问题可加–unsafe-perm）

构建静态文件（生成dist目录）

启动服务并设置开机自启

查看状态

创建站点配置

检查配置文件语法

重启Nginx生效

确保Nginx能访问文件

查看Django服务日志

查看Gunicorn错误（如果服务启动失败）

查看Nginx错误日志

查看访问日志

查看MySQL日志

测试数据库连接

查看8000端口占用

查看80端口占用

所有评论(0)

温馨提示：您尚未绑定手机号

LAOLONG-C