janderik/secviz
GitHub: janderik/secviz
一款基于 React 和 TypeScript 构建的安全可视化仪表板,将安全事件、告警与威胁情报整合为实时可交互的概览界面。
Stars: 0 | Forks: 0
# SecViz - 安全仪表板
一款用于可视化安全事件、警报和威胁的专业安全仪表板。
## 功能
- **仪表板**:包含统计卡片、事件时间线、按严重程度划分的警报、威胁类型分布、近期警报和活动信息流的概览
- **警报**:支持搜索/筛选的警报表格,带有详情弹窗
- **事件**:支持筛选的事件表格,包含来源、类型和严重程度筛选器
- **威胁**:包含统计摘要和世界地图可视化的威胁概览
- **设置**:主题切换和 API 连接配置
- **实时**:支持 WebSocket 实现实时更新
- **暗色主题**:以网络安全为灵感的暗色主题,带有绿色/青色点缀
- **响应式**:适用于桌面端和平板设备
## 技术栈
- React 18
- TypeScript
- Vite
- Recharts
- React Router v6
## 快速开始
```
npm install
npm run dev
```
在浏览器中打开 http://localhost:3000/secviz。
## 构建
```
npm run build
npm run preview
```
## Docker
```
docker compose up -d
```
## API 配置
默认情况下,SecViz 使用内置的模拟数据(1000 个事件,50 个警报,20 个威胁)独立运行。
要连接到真实的后端,请在“设置”中或通过环境变量配置 API URL:
- `VITE_SENTINEL_EYE_API` - SentinelEye API 端点
- `VITE_THREAT_PULSE_API` - ThreatPulse API 端点
- `VITE_WS_URL` - 用于实时更新的 WebSocket URL
## 项目结构
```
src/
├── api/ # API client with mock data fallback
├── components/ # UI components
│ ├── Alerts/
│ ├── Charts/
│ ├── common/
│ ├── Dashboard/
│ ├── Events/
│ ├── Layout/
│ └── Threats/
├── context/ # Theme context
├── hooks/ # Custom hooks (useApi, useWebSocket)
├── pages/ # Page components
├── types/ # TypeScript interfaces
└── utils/ # Formatters and constants
```
## 许可证
MIT
标签:HTTP/HTTPS抓包, React, Syscalls, 前端, 安全运营, 对抗机器学习, 态势感知, 扫描框架, 自动化攻击, 请求拦截