safeguard-web开发环境搭建DjangoVue3前后端分离架构部署教程【免费下载链接】safeguard-webLinux security audit, control, and behavior analysis web display.项目地址: https://gitcode.com/openeuler/safeguard-web前往项目官网免费下载https://ar.openeuler.org/ar/想要快速上手safeguard-web这款专业的 Linux 安全审计与控制 Web 管理平台吗本终极教程将手把手教你完成完整的开发环境搭建从零开始部署这个基于 Django Vue3 前后端分离架构的开源项目。无论你是运维工程师还是开发者只需 10 分钟就能搭建起完整的开发环境safeguard-web是一个功能强大的 Linux 安全审计、控制与行为分析 Web 展示平台提供用户权限管理、主机资产管理、OS 部署、系统迁移、网络负载均衡、安全部署、任务追踪及远程数据采集等核心功能。通过本教程你将学会如何快速搭建这个前后端分离的项目环境开始你的 Linux 安全运维开发之旅。 环境准备与前置要求在开始搭建safeguard-web开发环境之前确保你的系统满足以下基本要求系统要求操作系统Linux (Ubuntu/Debian/CentOS)、macOS 或 Windows (WSL2 推荐)Python 版本3.10 或更高版本Node.js 版本18.x 或更高版本内存至少 2GB 可用内存磁盘空间至少 500MB 可用空间必需软件包# Ubuntu/Debian 系统 sudo apt update sudo apt install python3-pip python3-venv nodejs npm redis-server -y # CentOS/RHEL 系统 sudo yum install python3-pip python3-venv nodejs npm redis -y 后端 Django 环境配置步骤第一步克隆项目仓库git clone https://gitcode.com/openeuler/safeguard-web cd safeguard-web第二步创建并激活 Python 虚拟环境# 创建虚拟环境 python3 -m venv venv # 激活虚拟环境 # Linux/macOS source venv/bin/activate # Windows venv\Scripts\activate第三步安装 Python 依赖包pip install -r requirements.txt关键依赖包括Django 4.2- Web 框架Django REST Framework 3.17- REST API 框架Celery 5.6- 异步任务队列Paramiko 2.12- SSH 连接库gRPC 1.81- 远程数据采集第四步配置数据库和初始化# 启用本地开发模式 export IS_LOCAL1 # 执行数据库迁移 python manage.py migrate # 初始化权限与默认角色 python manage.py init_authority # 重建系统菜单树 python manage.py rebuild_menus第五步启动后端服务python manage.py runserver 0.0.0.0:8000后端服务将在http://localhost:8000启动你可以访问以下地址验证API 文档http://localhost:8000/api/docs/健康检查http://localhost:8000/api/health/ 前端 Vue3 环境配置步骤第一步进入前端目录cd frontend第二步安装 Node.js 依赖npm install前端核心依赖包括Vue 3.3- 前端框架Vue Router 4- 路由管理Vuex 4- 状态管理Axios 1.16- HTTP 客户端Vite 5- 构建工具第三步启动前端开发服务器npm run dev前端服务将在http://localhost:5173启动打开浏览器即可看到登录界面。 前后端联调配置代理配置可选在frontend/vite.config.js中配置代理避免跨域问题export default defineConfig({ server: { proxy: { /api: { target: http://localhost:8000, changeOrigin: true, } } } })环境变量配置创建.env文件配置后端 API 地址# frontend/.env VITE_API_BASE_URLhttp://localhost:8000/api 一键启动脚本创建启动脚本简化开发流程#!/bin/bash # start_dev.sh echo 启动 safeguard-web 开发环境... # 启动后端 cd /path/to/safeguard-web source venv/bin/activate export IS_LOCAL1 python manage.py runserver 0.0.0.0:8000 # 启动前端 cd frontend npm run dev echo ✅ 后端运行在: http://localhost:8000 echo ✅ 前端运行在: http://localhost:5173 echo API 文档: http://localhost:8000/api/docs/ 测试环境验证后端测试# 在项目根目录执行 export IS_LOCAL1 python -m pytest backend/tests/ -q前端测试cd frontend npm run test:run功能测试清单完成环境搭建后验证以下核心功能✅用户登录- 访问http://localhost:5173/login✅API 文档- 访问http://localhost:8000/api/docs/✅权限管理- 验证角色和菜单权限✅主机管理- 测试主机资产CRUD操作✅任务中心- 查看异步任务状态⚙️ 生产环境部署要点数据库配置修改safeguard_web/settings.py中的数据库配置# 生产环境使用 MySQL DATABASES { default: { ENGINE: django.db.backends.mysql, NAME: safeguard_db, USER: your_username, PASSWORD: your_password, HOST: localhost, PORT: 3306, } }Redis 和 Celery 配置# 启动 Redis 服务 sudo systemctl start redis # 启动 Celery Worker celery -A safeguard_web worker -l info # 启动 Celery Beat定时任务 celery -A safeguard_web beat -l infogRPC Sensor 服务python manage.py grpc_server 常见问题解决问题1Python 依赖安装失败解决方案确保使用正确的 Python 版本python3 --version # 确认版本 3.10 pip install --upgrade pip setuptools wheel问题2Node.js 版本不兼容解决方案使用 nvm 管理 Node.js 版本curl -o- https://raw.githubusercontent.com/nvm-sh/nvm/v0.39.0/install.sh | bash nvm install 18 nvm use 18问题3数据库迁移失败解决方案清理并重新迁移rm db.sqlite3 # 删除旧的 SQLite 数据库 python manage.py makemigrations python manage.py migrate python manage.py init_authority问题4前端无法连接后端 API解决方案检查跨域配置和代理设置# 检查后端是否运行 curl http://localhost:8000/api/health/ # 检查前端代理配置 cat frontend/vite.config.js 项目结构详解了解项目结构有助于更好的开发体验safeguard-web/ ├── backend/ # Django 后端应用 │ ├── authentication/ # JWT 认证模块 │ ├── models/ # 数据模型定义 │ ├── services/ # 业务逻辑服务层 │ ├── serializers/ # API 序列化器 │ ├── views/ # 视图控制器 │ └── urls/ # 路由配置 ├── frontend/ # Vue3 前端应用 │ ├── src/views/ # 页面组件 │ ├── src/api/ # API 接口封装 │ ├── src/store/ # Vuex 状态管理 │ └── src/router/ # 前端路由 └── safeguard_web/ # Django 项目配置 开发环境优化技巧1. 使用 Docker 快速部署# Dockerfile.dev FROM python:3.10-slim WORKDIR /app COPY requirements.txt . RUN pip install -r requirements.txt COPY . . CMD [python, manage.py, runserver, 0.0.0.0:8000]2. 配置开发工具VS Code 扩展Python, Vue Language Features, ESLintPyCharmDjango 支持Vue.js 插件浏览器开发者工具Vue Devtools 扩展3. 热重载配置// frontend/vite.config.js export default { server: { hmr: { overlay: true } } } 下一步学习路径完成safeguard-web开发环境搭建后建议按以下路径深入学习核心功能开发- 学习 backend/models/ 中的数据结构API 接口设计- 研究 backend/views/ 中的 RESTful 接口前端组件开发- 查看 frontend/src/components/ 中的 Vue 组件权限系统实现- 分析 backend/permissions/ 权限控制逻辑异步任务处理- 学习 backend/tasks/ 中的 Celery 任务 最佳实践建议代码规范后端遵循 PEP 8 Python 代码规范前端使用 ESLint Prettier 统一代码风格提交代码前运行测试pytest backend/tests/和npm run test:run版本控制# 提交规范 git commit -m feat: 添加主机管理功能 git commit -m fix: 修复权限验证问题 git commit -m docs: 更新环境搭建文档性能优化使用 Django Debug Toolbar 进行性能分析配置数据库索引优化查询性能使用 Vue 3 Composition API 提高前端性能 总结通过本教程你已经成功完成了safeguard-web的完整开发环境搭建。这个基于 Django Vue3 前后端分离架构的 Linux 安全审计平台现在已经在你的本地环境中运行起来了关键收获✅ 掌握了 Python 虚拟环境和依赖管理✅ 学会了 Django 后端服务的配置和启动✅ 理解了 Vue3 前端项目的搭建流程✅ 实现了前后端分离架构的联调配置✅ 了解了生产环境部署的关键要点现在你可以开始探索safeguard-web的强大功能了从用户权限管理到主机资产管理从 OS 部署到安全审计这个平台为 Linux 安全运维提供了完整的解决方案。开始你的第一个功能开发或者深入研究现有的代码架构吧开发愉快【免费下载链接】safeguard-webLinux security audit, control, and behavior analysis web display.项目地址: https://gitcode.com/openeuler/safeguard-web创作声明：本文部分内容由AI辅助生成（AIGC），仅供参考
