DanoHackedYou/website-uptime-monitor
GitHub: DanoHackedYou/website-uptime-monitor
一个基于 FastAPI 与 React 的全栈网站可用性监控仪表板,用于持续跟踪网站响应时间、运行状态及事件历史。
Stars: 0 | Forks: 0
# 网站正常运行时间监控器
一个用于跟踪网站可用性、响应时间和事件历史的全栈正常运行时间监控仪表板。
本项目被设计为一个专业的作品集项目,展示了后端 API 开发、前端仪表板、SQLite 持久化、后台任务、Docker 和 GitHub Actions。
## 截图
## 功能
- 添加要监控的网站。
- 运行手动正常运行时间检查。
- 基于每个监控间隔的自动后台检查。
- 跟踪状态:正常 (up)、异常 (down) 或未知 (unknown)。
- 将历史检查存储在 SQLite 中。
- 计算每个网站的正常运行时间百分比。
- 显示平均响应时间和全局正常运行时间摘要。
- 启用或禁用监控器。
- 删除监控器。
- 响应式仪表板 UI。
- 支持 Docker Compose。
- GitHub Actions CI。
## 技术栈
### 后端
- Python
- FastAPI
- SQLite
- HTTPX
- Pydantic
- Uvicorn
### 前端
- React
- TypeScript
- Vite
- CSS
### DevOps
- Docker
- Docker Compose
- GitHub Actions
## 项目结构
```
website-uptime-monitor/
├── backend/
│ ├── app/
│ │ ├── services/
│ │ │ └── monitor_service.py
│ │ ├── database.py
│ │ ├── main.py
│ │ └── models.py
│ ├── Dockerfile
│ └── requirements.txt
├── frontend/
│ ├── src/
│ │ ├── components/
│ │ ├── services/
│ │ ├── App.tsx
│ │ ├── main.tsx
│ │ └── styles.css
│ ├── package.json
│ └── vite.config.ts
├── .github/
│ └── workflows/
│ └── ci.yml
├── docker-compose.yml
├── .gitignore
└── README.md
```
## 本地安装说明
### 后端
```
cd backend
python -m venv venv
venv\Scripts\activate
pip install -r requirements.txt
python -m uvicorn app.main:app --reload
```
在 macOS/Linux 上:
```
cd backend
python3 -m venv venv
source venv/bin/activate
pip install -r requirements.txt
python -m uvicorn app.main:app --reload
```
后端 URL:
```
http://localhost:8000
```
API 文档:
```
http://localhost:8000/docs
```
### 前端
打开另一个终端:
```
cd frontend
npm install
npm run dev
```
前端 URL:
```
http://localhost:5173
```
## Docker
从项目根目录运行:
```
docker compose up --build
```
然后打开:
```
http://localhost:5173
```
## API 端点
| Method | Endpoint | Description |
| --- | --- | --- |
| GET | `/health` | 健康检查 |
| GET | `/api/summary` | 仪表板摘要 |
| GET | `/api/monitors` | 列出监控器 |
| POST | `/api/monitors` | 创建监控器 |
| GET | `/api/monitors/{id}` | 获取监控器 |
| PATCH | `/api/monitors/{id}` | 更新监控器 |
| DELETE | `/api/monitors/{id}` | 删除监控器 |
| POST | `/api/monitors/{id}/check` | 运行手动检查 |
| GET | `/api/monitors/{id}/checks` | 列出最近的检查 |
## 监控器 Payload 示例
```
{
"name": "GitHub",
"url": "https://github.com",
"interval_seconds": 300,
"timeout_seconds": 10,
"enabled": true
}
```
## 环境变量
如果您想自定义 SQLite 路径,请创建 `backend/.env`:
```
DATABASE_PATH=uptime_monitor.db
```
## 路线图
- 电子邮件或 webhook 告警。
- 事件时间线。
- 公共状态页面。
- 身份验证。
- 团队工作区。
- PostgreSQL 支持。
- 部署到 Render 和 Vercel。
- 导出 CSV 报告。
## GitHub Topics
推荐的 topics:
```
uptime-monitor
fastapi
react
typescript
sqlite
sre
dashboard
website-monitoring
portfolio-project
docker
github-actions
```
## 部署说明
本项目包含后端,因此不适合仅使用 GitHub Pages 进行部署。
推荐部署方案:
- 前端:Vercel 或 Netlify。
- 后端:Render、Railway 或 Fly.io。
- 数据库:演示环境使用 SQLite,生产环境使用 PostgreSQL。
## 状态
MVP 已完成,可用于作品集展示。
## 许可证
MIT License。
## 功能
- 添加要监控的网站。
- 运行手动正常运行时间检查。
- 基于每个监控间隔的自动后台检查。
- 跟踪状态:正常 (up)、异常 (down) 或未知 (unknown)。
- 将历史检查存储在 SQLite 中。
- 计算每个网站的正常运行时间百分比。
- 显示平均响应时间和全局正常运行时间摘要。
- 启用或禁用监控器。
- 删除监控器。
- 响应式仪表板 UI。
- 支持 Docker Compose。
- GitHub Actions CI。
## 技术栈
### 后端
- Python
- FastAPI
- SQLite
- HTTPX
- Pydantic
- Uvicorn
### 前端
- React
- TypeScript
- Vite
- CSS
### DevOps
- Docker
- Docker Compose
- GitHub Actions
## 项目结构
```
website-uptime-monitor/
├── backend/
│ ├── app/
│ │ ├── services/
│ │ │ └── monitor_service.py
│ │ ├── database.py
│ │ ├── main.py
│ │ └── models.py
│ ├── Dockerfile
│ └── requirements.txt
├── frontend/
│ ├── src/
│ │ ├── components/
│ │ ├── services/
│ │ ├── App.tsx
│ │ ├── main.tsx
│ │ └── styles.css
│ ├── package.json
│ └── vite.config.ts
├── .github/
│ └── workflows/
│ └── ci.yml
├── docker-compose.yml
├── .gitignore
└── README.md
```
## 本地安装说明
### 后端
```
cd backend
python -m venv venv
venv\Scripts\activate
pip install -r requirements.txt
python -m uvicorn app.main:app --reload
```
在 macOS/Linux 上:
```
cd backend
python3 -m venv venv
source venv/bin/activate
pip install -r requirements.txt
python -m uvicorn app.main:app --reload
```
后端 URL:
```
http://localhost:8000
```
API 文档:
```
http://localhost:8000/docs
```
### 前端
打开另一个终端:
```
cd frontend
npm install
npm run dev
```
前端 URL:
```
http://localhost:5173
```
## Docker
从项目根目录运行:
```
docker compose up --build
```
然后打开:
```
http://localhost:5173
```
## API 端点
| Method | Endpoint | Description |
| --- | --- | --- |
| GET | `/health` | 健康检查 |
| GET | `/api/summary` | 仪表板摘要 |
| GET | `/api/monitors` | 列出监控器 |
| POST | `/api/monitors` | 创建监控器 |
| GET | `/api/monitors/{id}` | 获取监控器 |
| PATCH | `/api/monitors/{id}` | 更新监控器 |
| DELETE | `/api/monitors/{id}` | 删除监控器 |
| POST | `/api/monitors/{id}/check` | 运行手动检查 |
| GET | `/api/monitors/{id}/checks` | 列出最近的检查 |
## 监控器 Payload 示例
```
{
"name": "GitHub",
"url": "https://github.com",
"interval_seconds": 300,
"timeout_seconds": 10,
"enabled": true
}
```
## 环境变量
如果您想自定义 SQLite 路径,请创建 `backend/.env`:
```
DATABASE_PATH=uptime_monitor.db
```
## 路线图
- 电子邮件或 webhook 告警。
- 事件时间线。
- 公共状态页面。
- 身份验证。
- 团队工作区。
- PostgreSQL 支持。
- 部署到 Render 和 Vercel。
- 导出 CSV 报告。
## GitHub Topics
推荐的 topics:
```
uptime-monitor
fastapi
react
typescript
sqlite
sre
dashboard
website-monitoring
portfolio-project
docker
github-actions
```
## 部署说明
本项目包含后端,因此不适合仅使用 GitHub Pages 进行部署。
推荐部署方案:
- 前端:Vercel 或 Netlify。
- 后端:Render、Railway 或 Fly.io。
- 数据库:演示环境使用 SQLite,生产环境使用 PostgreSQL。
## 状态
MVP 已完成,可用于作品集展示。
## 许可证
MIT License。标签:AV绕过, Docker, FastAPI, React, SQLite, Syscalls, 安全防御评估, 版权保护, 网站可用性监控, 请求拦截, 运维监控, 逆向工具