AI导哈

日志收集服务

mcp-logger是一个模型上下文协议（MCP）服务器和客户端工具包，用于从浏览器和Node.js进程捕获结构化日志消息，并将其转发给MCP感知工具，同时提供实时Web仪表板和本地调试支持。

  • by timotholt
  • JavaScript
  • 本地部署
  • 更新于
在 GitHub 查看 timotholt/mcp-logger

使用说明

mcp记录仪

概述

mcp-logger 是一个模型上下文协议（MCP）服务器和配套客户端 从浏览器和Node.js捕获结构化日志消息的工具包 过程。它将这些日志转发给MCP感知工具（Claude、VS Code、Windsurf、， 等等），提供实时网络仪表板，并保持本地控制台输出的完整性 本地调试。

目标

  • 从多个客户端（浏览器或节点）收集日志，并区分其 来源。
  • 保留本地 console.* 将结构化条目流式传输到 MCP服务器。
  • 提供实时查看（web UI+MCP日志通知）和历史记录 通过fetch API进行检索。
  • 支持缓冲区清理和命名会话，因此测试运行易于区分。
  • 保持交通中立，并开放供社区采用。

功能集

  1. MCP日志服务器 –stdio兼容服务器，可选HTTP/WebSocket 桥接、环形缓冲存储和工具API(push_log, fetch_logs, clear_logs, set_session).
  2. Web仪表板 –服务器为实时日志提供Vite驱动的SPA服务 监控、过滤、会话控制和健康/元/事件的快速链接 端点加上浏览器内演示。
  3. 客户端适配器 –包装的浏览器和节点助手 console.log，发送 将结构化有效载荷发送到服务器并保留本地控制台输出。
  4. 会话和客户端标记 –每个日志包括 clientId 和 sessionId 用于过滤和分组的元数据。
  5. 结构化架构 –共享级别、有效载荷形状和 保持所有包同步的验证逻辑。

建筑

┌────────────────────────┐      ┌───────────────────────────┐
│ Browser Client         │      │ Node Client               │
│ @mcp-logger/browser    │      │ @mcp-logger/node          │
│ • console hook         │      │ • console hook            │
│ • HTTP/WebSocket push  │      │ • HTTP/WebSocket/stdio    │
└──────────┬─────────────┘      └──────────┬────────────────┘
           │                                │
           ▼                                ▼
      ┌────────────────────────────────────────────────────┐
      │ mcp-logger Server                                  │
      │ • MCP stdio transport                              │
      │ • HTTP + WebSocket endpoints                       │
      │ • Ring buffer + sessions                           │
      │ • Tools: push_log, fetch_logs, clear_logs,          │
      │   set_session                                      │
      │ • MCP logging notifications                        │
      └──────────┬────────────────────────────┬────────────┘
                 │                            │
                 ▼                            ▼
      ┌────────────────────┐        ┌──────────────────────┐
      │ Web Dashboard      │        │ MCP Clients (IDE, AI)│
      │ SSE / WebSocket    │        │ logging/fetch tools  │
      └────────────────────┘        └──────────────────────┘

服务器组件

  • 传输层 –stdio MCP接口加上可选的HTTP服务器 浏览器客户端和仪表板的WebSocket/SSE端点。
  • 环形缓冲存储器 –可配置的内存循环缓冲区，用于存储 记录、维护游标，并在容量不足时跟踪删除的条目 超过。
  • 会话管理器 –问题 sessionId 令牌、记录开始/结束元数据， 并向客户端公开会话列表。
  • 工具操作员
    • logging/push –验证有效载荷，标记时间戳/序列，将条目放入 缓冲区和广播通知。
    • logging/fetch –按级别、客户端、会话、时间窗口和返回进行筛选 用光标对结果进行分页。
    • logging/clear –重置缓冲区（可选择启动新的默认会话） 并通知用户。
    • logging/set-session –创建或重命名会话范围并将 活跃的 sessionId.
  • 通知调度程序 –发出MCP日志通知和广播 WebSocket/SSE用户。

数据模型

{
  "id": "uuid",
  "timestamp": "ISO-8601 string",
  "sequence": 123456,
  "level": "trace|debug|info|warn|error|fatal",
  "clientId": "renderer-web",
  "sessionId": "run-48",
  "message": "Fog renderer ready",
  "data": { "module": "fog", "details": { "cells": 2048 } },
  "source": "browser-http"
}

测井流程

  1. 客户端适配器补丁 console.* 并将结构化有效载荷转发给 服务器。
  2. 服务器验证有效载荷，分配序列号，存储在环形缓冲区中，以及 发出MCP通知+WebSocket更新。
  3. MCP客户端（Claude、IDE）使用 logging/fetch 检索批次或流 实时消息；仪表板实时更新。
  4. 用户或自动化呼叫 logging/clear / logging/set-session 重置或 标记测试运行，确保会话之间的差异清晰。

客户端适配器

  • 浏览器 (@mcp-logger/browser)
    • attachLogger({ endpoint, clientId, sessionId?, levels?, enabled? }) –满 控制台挂钩用于应用程序集成。
    • 轻量级助手 mcpLog(message, session?, client?) 用于快速脚本或 演示。默认为 '.' 用于会话/客户端；传递新值会更新 在发送之前存储标识符。使用Fetch批处理并回退到XHR （ES5兼容版本）。
    • 编译到ES5的内置输出（没有可选的链接、箭头函数等） 因此，它可以在传统引擎中运行。
    • 尊重运行时功能标志，因此可以在不重新加载的情况下切换日志记录。
  • 节点 (@mcp-logger/node)
    • 类似API；保留stdout/stderr；未处理的可选挂钩 拒绝或自定义元数据注入器。
  • 两个适配器都能确保 clientId 默认值（主机名+PID或URL），同时允许 多客户端部署的显式覆盖。

Web仪表板

  • 在服务器根上使用Vite构建的静态资产提供服务。
  • 粘性标题显示元数据以及指向的快速链接 /health, /meta, /events，以及 /demo，旁边是“清除日志”按钮。
  • 通过SSE/Webocket连接以获取实时更新。
  • UI功能：级别切换、客户端/会话过滤器、文本搜索、时间线 图形、清除/会话按钮、JSON导出、主题切换。
  • 在引擎盖下使用MCP工具端点进行破坏性操作（清除、启动 会话）。

浏览器演示

访问 /demo 看看 mcpLog 助手在行动。该页面导入 浏览器包，如果加载失败，会立即抛出，并发送 info 每三秒发送一条消息：

<script src="/client/index.js"></script>
<script>
  mcpLog('Random message', 'demo-session', 'demo-browser')
</script>

提供 session/client 参数更新存储的标识符；省略它们 保留以前的值（默认为 '.').

配置

  • 环境变量/配置文件
    • LOG_BUFFER_SIZE –内存中保存的最大条目数。
    • LOG_HTTP_PORT –可选HTTP/WebSocket侦听器。
    • LOG_AUTH_TOKEN –远程推送需要承载令牌。
    • LOG_PERSIST_PATH （future）–NDJSON存档目录。
  • IDE自动启动（VS代码/Windsurf）
    • 在下面添加条目 mcpServers 指向 node packages/server/index.js 与适当 cwd.
  • 可选的npm脚本： dev （观看模式）， start （prod服务器）， dashboard （独立运行web UI）。
    • LOG_BROWSER_TARGET=es5 （为传统构建控制Babel预设的标志 捆绑）。

没有工作空间的地方发展

repo现在依赖于带有direct的普通npm file: 链接而不是 工作空间。使用项目根脚本保持包构建同步：

npm install
npm run build:shared
npm run build:server
npm run build:browser
npm run build:node
npm run build:dashboard

这 npm run build 快捷键按顺序链接这些命令。每个包裹都可以 也可以通过以下方式单独构建或测试 npm run <script> --prefix packages/<name>.

路线图

  1. 脚手架仓库（工作区、linting、测试、GitHub工作流）。
  2. 实现共享模式实用程序和单元测试。
  3. 构建服务器MVP（MCP stdio+HTTP/WebSocket、环形缓冲区、工具处理程序）。
  4. 发布带有控制台挂钩和传输逻辑的浏览器和节点适配器。
  5. 发布基本的web仪表板（实时表、过滤器、清除/会话控件）。
  6. 添加持久性/导出、身份验证挂钩、CLI实用程序和文档。
  7. 将包发布到npm并准备GitHub发布模板。

状态

  • 规范起草——实施中。

相关 MCP