《从零开发DevOps 平台——FastAPI + Vue3》——可当毕业设计

一个基于 FastAPI + Vue3 的轻量级 DevOps 平台，从代码提交到 K8s 部署，全流程可视化。

在互联网快速迭代的今天，研发与运维的协作效率直接决定了产品的交付速度。传统的运维方式存在以下痛点：

🔴 代码发布靠手动，频繁出错

🔴 服务器分散管理，缺乏统一视图

🔴 流水线构建状态不可见，排查困难

🔴 多环境、多项目、多服务管理混乱

DevOps 平台应运而生，提供一个可视化、可扩展、易上手的一站式运维管理解决方案。

🏗️ 技术架构

前端技术栈

技术用途版本
Vue 3前端框架（组合式 API）3.4+
TypeScript类型安全，提升代码质量5.0+
Vite极速构建工具5.0+
Element Plus企业级 UI 组件库2.6+
Pinia轻量状态管理2.1+
Vue Router前端路由管理4.2+
AxiosHTTP 请求拦截与统一管理1.6+
Xterm.js浏览器端 Web SSH 终端5.3+

后端技术栈

技术用途版本
FastAPI高性能异步 Web 框架0.109+
SQLAlchemy异步 ORM（支持 MySQL/PostgreSQL）2.0+
Python-JOSEJWT 认证与授权3.3+
BCrypt密码安全加密4.1+
ParamikoSSH 远程连接（Web 终端）3.4+
Docker SDK镜像构建与推送7.0+
Kubernetes ClientK8s 集群部署管理28.1+
WebSocket实时日志推送FastAPI 原生
UvicornASGI 高性能服务器0.27+

核心功能模块

1️⃣ 用户认证与权限管理

  • JWT 双 Token 认证

  • 基于角色的权限控制（RBAC）

  • 管理员/普通用户分级管理

2️⃣ 项目管理

  • 项目/环境/服务三级结构

  • 支持多环境（生产/UAT/开发）

  • 项目级服务器资源隔离

3️⃣ 服务器管理

  • 服务器信息统一管理（IP/OS/环境/状态）

  • Web SSH 远程终端（基于 Xterm.js）

  • 服务器与项目动态关联/移出

4️⃣ CI/CD 流水线

  • 可视化阶段步骤（拉取代码 → 编译 → 构建镜像 → 部署）

  • 支持自定义构建步骤

  • 流水线执行状态实时追踪

  • 执行历史与日志回溯

  • 一键执行 + 版本号输入

5️⃣ 管道图形化展示

  • 步骤节点 + 状态圆点（绿/红/灰/蓝闪烁）

  • 点击阶段名称编辑配置（代码仓库/编译命令/镜像名/K8s 命名空间）

6️⃣ Kubernetes 部署集成（未开发）

  • 通过 K8s API 更新 Deployment 镜像

  • 支持多命名空间管理

  • 滚动更新状态实时反馈

7️⃣ 数据统计仪表盘（未开发）

  • 项目数/服务器数/流水线数/今日部署次数

  • 最近部署记录快速查看

  • 模块快速入口（项目管理/服务器管理/CI/CD）

📸 界面预览

  • 流水线列表：Jenkins 风格，一行一个流水线，状态清晰

  • 管道图形：步骤节点 + 状态圆点，直观展示执行进度

  • 项目管理：项目/环境/服务器三层结构，资源隔离

  • Web SSH：浏览器直接登录服务器，无需额外工具

🚀 未来规划

功能状态预计完成
应用监控（Prometheus 集成）📋 规划中2026 Q4
告警通知（钉钉/邮件）📋 规划中2026 Q4
批量命令执行（Ansible 集成）📋 规划中2026 Q4
服务拓扑图📋 规划中2026 Q4

可以联系获取源码（不免费|九九|接受的来）