XuJiacheng
6d713c22ed
添加前后端Dockerfile和docker-compose配置 创建部署脚本deploy.sh 完善项目文档结构包括前后端文档、API文档和部署文档 更新README提供项目概述和快速开始指南 文档包括详细的技术栈说明、功能模块介绍和部署指南 部署方案支持一键式容器化部署和宝塔面板集成
6.8 KiB
6.8 KiB
部署文档
部署环境
- Ubuntu 20.04 LTS+
- 宝塔面板 7.0+
- Docker
- Node.js 22+
部署架构
┌───────────────┐
│ 宝塔面板 │
└───────────────┘
│
▼
┌───────────────────────┐
│ Nginx (反向代理) │
└───────────────────────┘
│
├───────────────┐
▼ ▼
┌───────────────┐ ┌───────────────┐
│ 前端容器 │ │ 后端容器 │
└───────────────┘ └───────────────┘
│ │
└───────────────┘
│
▼
┌────────────────┐
│ Pocketbase DB │
└────────────────┘
准备工作
1. 安装宝塔面板
# 安装宝塔面板
wget -O install.sh http://download.bt.cn/install/install-ubuntu_6.0.sh && sudo bash install.sh
# 安装完成后，根据提示访问面板地址并设置账号密码
2. 安装Docker
在宝塔面板中：
- 打开「软件商店」
- 搜索「Docker」并安装
- 等待安装完成
3. 安装Node.js
在宝塔面板中：
- 打开「软件商店」
- 搜索「Node.js」并安装对应版本
- 等待安装完成
后端部署
1. 创建Dockerfile
在 back-end 目录创建 Dockerfile 文件：
FROM node:22-alpine
WORKDIR /app
COPY package*.json ./
RUN npm install
COPY . .
EXPOSE 3000
CMD ["node", "src/index.js"]
2. 创建docker-compose.yml
在项目根目录创建 docker-compose.yml 文件：
version: '3.8'
services:
backend:
build:
context: ./back-end
dockerfile: Dockerfile
ports:
- "3000:3000"
environment:
- NODE_ENV=production
- PORT=3000
- DB_HOST=db
- DB_PORT=8080
depends_on:
- db
restart: always
frontend:
build:
context: ./front-end
dockerfile: Dockerfile
ports:
- "80:80"
restart: always
db:
image: pocketbase/pocketbase:latest
ports:
- "8080:8080"
volumes:
- ./data:/pb_data
restart: always
3. 前端Dockerfile
在 front-end 目录创建 Dockerfile 文件：
FROM node:22-alpine as build
WORKDIR /app
COPY package*.json ./
RUN npm install --legacy-peer-deps
COPY . .
RUN npm run build
FROM nginx:alpine
COPY --from=build /app/dist /usr/share/nginx/html
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
一键部署脚本
1. 创建部署脚本
在项目根目录创建 deploy.sh 文件：
#!/bin/bash
# 部署脚本
echo "开始部署BAI管理系统..."
# 停止并移除旧容器
echo "停止并移除旧容器..."
docker-compose down
# 构建并启动新容器
echo "构建并启动新容器..."
docker-compose up -d --build
# 查看容器状态
echo "查看容器状态..."
docker ps
echo "部署完成！"
echo "前端访问地址: http://$(hostname -I | awk '{print $1}')"
echo "后端API地址: http://$(hostname -I | awk '{print $1}'):3000"
echo "Pocketbase管理地址: http://$(hostname -I | awk '{print $1}'):8080/_/"
2. 赋予脚本执行权限
chmod +x deploy.sh
3. 执行部署脚本
./deploy.sh
宝塔面板配置
1. 添加网站
- 打开宝塔面板
- 点击「网站」→「添加站点」
- 填写域名信息（如果有域名）
- 选择「纯静态」网站类型
- 点击「提交」
2. 配置反向代理
- 进入网站设置
- 点击「反向代理」→「添加反向代理」
- 配置前端代理：
- 代理名称：frontend
- 目标URL：http://localhost:80
- 发送域名：你的域名
- 配置后端代理：
- 代理名称：backend
- 目标URL：http://localhost:3000
- 发送域名：你的域名
- 路径：/api
- 点击「保存」
3. 配置SSL证书（可选）
- 进入网站设置
- 点击「SSL」→「Let's Encrypt」
- 申请并安装SSL证书
- 开启「强制HTTPS」
环境变量配置
后端环境变量
在 back-end/.env 文件中配置：
# Server Configuration
PORT=3000
NODE_ENV=production
# Database Configuration
DB_HOST=db
DB_PORT=8080
DB_NAME=bai_management
# JWT Configuration
JWT_SECRET=your_jwt_secret_key
JWT_EXPIRES_IN=24h
# CORS Configuration
CORS_ORIGIN=*
前端环境变量
在 front-end/.env.production 文件中配置：
VUE_APP_API_BASE_URL=http://your-domain.com/api
VUE_APP_TITLE=BAI管理系统
VUE_APP_VERSION=1.0.0
数据库配置
Pocketbase设置
- 访问 Pocketbase 管理界面：http://服务器IP:8080/_/
- 创建管理员账号
- 创建必要的集合：
- users (用户)
- data (数据)
- videos (视频)
- logs (日志)
监控与维护
查看日志
# 查看后端日志
docker logs -f backend
# 查看前端日志
docker logs -f frontend
# 查看数据库日志
docker logs -f db
备份数据
# 备份Pocketbase数据
docker cp db:/pb_data ./backup
# 恢复Pocketbase数据
docker cp ./backup db:/pb_data
升级项目
- 拉取最新代码
- 执行部署脚本：
./deploy.sh
常见问题
1. 容器启动失败
检查容器日志：
docker logs -f 容器名称
2. 访问接口报错
- 检查反向代理配置
- 检查后端服务是否正常运行
- 检查数据库连接是否正常
3. 前端页面空白
- 检查前端容器是否正常运行
- 检查Nginx配置
- 检查API地址配置是否正确
4. 数据库连接失败
- 检查数据库容器是否正常运行
- 检查数据库连接配置
- 检查网络连接
性能优化
1. 前端优化
- 启用Gzip压缩
- 静态资源缓存
- 代码分割
- 图片优化
2. 后端优化
- 使用PM2进程管理
- 数据库索引优化
- 缓存策略
- 负载均衡
3. 服务器优化
- 调整Docker内存限制
- 配置Nginx缓存
- 启用HTTPS
- 定期清理日志
安全措施
1. 服务器安全
- 配置防火墙
- 禁用root登录
- 使用SSH密钥认证
- 定期更新系统
2. 应用安全
- 使用HTTPS
- 密码加密存储
- 输入验证
- 防止SQL注入
- 防止XSS攻击
3. 数据安全
- 定期备份数据
- 数据加密
- 访问控制
- 审计日志
总结
本部署方案采用Docker容器化部署，实现了前后端分离的架构，支持一键部署和自动化管理。通过宝塔面板的反向代理功能，实现了域名访问和SSL证书配置，为系统提供了安全、稳定的运行环境。