bi-watcher 插件

bi-watcher 是一个 Whistle 插件，用于监控和上报网络请求数据。

🚀 功能特性

• ✅ 实时拦截网络请求
• ✅ 自动提取请求数据（URL、方法、请求头、请求体等）
• ✅ 通过 WebSocket 实时上报数据到后端
• ✅ 自动重连机制
• ✅ 详细的日志输出

📋 使用步骤

1. 安装依赖

cd whistle-plugin/bi-watcher
npm install

2. 编译插件

npm run build

3. 在 Whistle 中配置规则

在 Whistle 中添加以下规则：

fa.micstatic.com whistle.bi-watcher://none

4. 启动后端服务

确保 backend 服务已启动（端口 8001）：

cd backend
uvicorn src.main:app --host 0.0.0.0 --port 8001 --reload

5. 启动前端服务

确保 frontend 服务已启动：

cd frontend
npm run start

📊 日志输出

插件启动后，会在 Whistle 控制台看到详细的日志：

启动日志示例

============================================================
[2025-12-10T10:30:00.000Z] bi-watcher 插件已启动
[2025-12-10T10:30:00.000Z] 插件版本: 1.0.2
[2025-12-10T10:30:00.000Z] 配置选项: {}
============================================================
[2025-12-10T10:30:00.001Z] 正在初始化 WebSocket 连接...
[2025-12-10T10:30:00.001Z] 🔌 正在连接到 WebSocket: ws://10.10.118.115:8001/api/ws/bi-watcher

请求拦截日志示例

============================================================
[2025-12-10T10:30:05.123Z] 🆕 新请求拦截 - ID: m8k2n5p0
  📡 请求方法: GET
  🔗 请求URL: https://fa.micstatic.com/path?data=test
  👤 客户端IP: 192.168.1.100
  ⚙️  规则值: none
============================================================
[2025-12-10T10:30:05.124Z] ✅ 检测到 data= 参数，准备上报...
  📝 Data 参数: data=test
[2025-12-10T10:30:05.125Z] 📤 正在通过 WebSocket 上报数据...
[2025-12-10T10:30:05.126Z] ✅ WebSocket 消息已发送: m8k2n5p0
[2025-12-10T10:30:05.127Z] ✅ 请求数据已上报 - ID: m8k2n5p0

🔗 数据流

网络请求
  → Whistle 代理
  → bi-watcher 插件拦截
  → 提取请求数据
  → WebSocket 上报到 backend (端口 8001)
  → backend 转换为 LogEntry 格式
  → WebSocket 广播给前端客户端
  → 前端实时展示埋点日志

🔧 WebSocket 连接

• 后端 WebSocket 端点: ws://10.10.118.115:8001/api/ws/bi-watcher
• 前端 WebSocket 端点: ws://10.10.118.115:8001/proxy/api/ws/logs

📝 注意事项

1. 确保后端服务（端口 8001）已启动
2. 如果 WebSocket 连接失败，插件会自动重连（5秒间隔）
3. 所有请求数据都会通过 WebSocket 实时上报
4. 在 Whistle 控制台查看详细日志

🐛 故障排除

没有日志输出？

1. 检查插件是否正确编译：npm run build
2. 检查 Whistle 是否正确加载插件
3. 检查规则配置是否正确

WebSocket 连接失败？

1. 检查后端服务是否启动：curl http://10.10.118.115:8001/
2. 检查防火墙设置
3. 查看后端日志

前端没有显示数据？

1. 打开浏览器开发者工具查看控制台错误
2. 检查前端 WebSocket 连接状态
3. 查看后端日志确认数据已接收

📄 许可证

MIT