Amazon Q - MCP 管理员仪表板
一个现代、响应式的基于网页的仪表板,用于在macOS上管理Amazon Q MCP(模型上下文协议)服务器。此仪表板让您能够轻松查看、启用和禁用在您的系统中配置的MCP服务器 ~/.aws/amazonq/mcp.json 文件。
特点/功能
- 🎛️ 这个符号在中文中通常被用作表示“控制面板”或“仪表盘”的意思,尤其是在描述电子设备或计算机系统时。所以,翻译成中文可以是“控制面板”或“仪表盘”。 仪表板概览一目了然地查看所有已配置的MCP服务器
- 🟢(绿色圆圈,常用于表示状态良好、通过或确认) 状态指示器绿/红灯显示启用/禁用状态
- ⚡(闪电符号,常用于表示快速、能量、电力或惊喜等含义) 快速操作启用/禁用单个服务器或一次性启用/禁用所有服务器
- 📊 表格/数据图表 统计实时统计显示总服务器数、已启用服务器数和已禁用服务器数
- 🔄 旋转(或循环) 自动同步自动读取和写入您的MCP配置文件
- 📱 代表手机的符号。 响应式设计在桌面、平板和手机上均完美运行
- 🎨 表示“艺术/绘画”或“涂鸦/涂鸦艺术”(具体含义可能根据上下文有所不同)。 现代用户界面简洁直观的界面,动画流畅
- 🔒(锁形符号,常用于表示安全、保密或锁定状态) 安全操作在更改之前创建备份
- ⌨️(键盘) 键盘快捷键通过键盘快捷键快速访问
截图
浅色模式
采用玻璃质感设计的简洁现代界面,搭配直观的控件:
暗黑模式
这款设计采用流畅的深色主题,增强视觉对比度,彰显现代美学:
仪表盘操作指南
根据上面的截图,这是您在仪表盘上会看到的内容:
🎛️ 可以翻译为“控制面板”或“调音台”,具体取决于上下文和使用场景。 标题栏与控件
- 仪表板标题“MCP 管理员仪表盘”,配以优雅的字体设计
- 主题切换右上角的日/月图标用于在浅色模式和深色模式之间切换
- 刷新按钮从您的MCP文件重新加载服务器配置
- 服务器统计实时计数显示“总计:4,已启用:2,已禁用:2”
📊(图表/数据) 服务器管理网格
每个服务器都以单独的卡片形式显示,包含:
- 服务器名称明确标注(例如,“文件系统”,“brave-search”,“mcp-server-git”,“postgres”)
- 服务器类型徽章视觉指示器显示类型(Docker、Python、Node.js 等)
- 状态指示器绿色圆点(启用)或红色圆点(禁用),带有动画脉冲效果
- 命令预览显示将要执行的实际命令
- 启用/禁用切换每个服务器都有单独的控制按钮
- 服务器详情环境变量、参数和配置信息
⚡(闪电符号,常用于表示速度、能量或警告等,具体含义需结合上下文理解) 批量操作面板
- “启用全部”按钮一键激活所有MCP服务器
- “禁用全部”按钮同时停用所有服务器
- 操作反馈Toast通知确认操作成功
📈 表示“上升趋势”或“增长”。 实时活动时间线
- 活动日志显示带有时间戳的最近操作
- 动作类型服务器已启用/禁用,配置已刷新,等等。
- 时间戳每个操作的精确时间(例如,“下午3:28:45”)
- 行动成功对已完成操作的视觉确认
🎨(涂鸦/绘画) 视觉设计元素
- 玻璃材质卡片(或“玻璃形态卡片”)带有背景模糊效果的半透明卡片
- 渐变背景美丽的蓝紫色渐变背景
- 流畅的动画交互元素上的悬停效果和过渡动画
- 字体层级通过不同的字体粗细,清晰呈现信息层级
- 彩色编码状态直观的绿色/红色服务器状态系统
- 响应式布局适应不同屏幕尺寸的网格系统
🔧 修理工具/螺丝刀 实际应用场景
仪表板使您能够:
- 快速服务器概览一目了然地查看所有MCP服务器及其状态
- 个人控制根据需要启用或禁用特定服务器
- 批量管理开启/关闭所有服务器以进行测试或维护
- 配置监控跟踪更改并验证服务器状态
- 活动追踪审查进行了哪些更改以及更改的时间
- 主题偏好选择您偏好的视觉模式以确保舒适度
先决条件
- 安装了Amazon Q CLI的macOS系统
- Node.js(版本14或更高)
- MCP 配置文件位于
~/.aws/amazonq/mcp.json
安装
- 克隆仓库:
git clone https://github.com/YOUR_USERNAME/q-mcp-manager.git
cd q-mcp-manager- 安装依赖项:
npm install- 验证您的MCP配置是否存在:
ls -la ~/.aws/amazonq/mcp.json使用方法
🚀 快速启动选项
选项1:标准开始(最简单)
./start.sh start --background选项2:持续启动(终端关闭后继续运行)
./start-persistent.sh选项3:访问运行仪表板
./access-dashboard.sh确保脚本具有可执行权限: chmod +x *.sh scripts/*.sh
✅ 服务器启动 + 控制面板打开 + 终端可用!
🎛️ 这个符号在中文中通常没有直接对应的翻译,它是一个表示控制面板或仪表盘的图形符号。在中文语境中,我们可能会用“控制面板”、“仪表盘”或类似的描述来传达其含义,但直接翻译这个符号本身并不具备明确的中文词汇对应。因此,如果需要在中文中描述这个符号,通常会结合上下文使用相关的描述性语言。 替代方法
直接服务器脚本:
./scripts/server.sh start --backgroundNPM 命令:
npm start # Standard start
npm run dev # Development mode要停止: 点击仪表板标题栏中的红色“关机”按钮,或使用 ./scripts/server.sh stop
📱 将仪表板添加到书签
http://localhost:3000 # Default port
http://localhost:8080 # Custom port example📱 将仪表板添加为书签
http://localhost:3000 # Default port
http://localhost:8080 # Custom port example______________________________________________________________________
统一服务器控制
所有服务器操作都使用同一个脚本: ./scripts/server.sh
🔧(扳手/修理工具) 基本命令
./scripts/server.sh start [options]- 启动服务器(自动打开浏览器)./scripts/server.sh stop [options]- 优雅地停止服务器./scripts/server.sh restart [options]- 重启服务器./scripts/server.sh status [options]- 检查服务器状态和健康状况./scripts/server.sh logs [--follow]- 查看服务器日志./scripts/server.sh help- 显示所有可用命令
🌐 表示“互联网”或“世界万维网”。 端口定制(新功能!)
在任意端口上运行仪表板,以避免冲突或满足您的偏好设置:
默认端口(3000):
./scripts/server.sh start --background自定义端口选项:
# Using --port flag
./scripts/server.sh start --port 8080 --background
./scripts/server.sh start -p 5000 --background --no-open
# Using --port= syntax
./scripts/server.sh start --port=4000 --background
# All commands support custom ports
./scripts/server.sh status --port 8080
./scripts/server.sh stop --port 8080端口验证:
- ✅ 端口1-65535均有效
- ⚠️ 低于1024的端口显示特权警告
- ❌ 无效端口将被拒绝,并附带明确的错误信息
- 🔍 自动端口冲突检测
常见使用场景:
- 多个实例在不同端口上运行不同项目的仪表板
- 避免冲突当3000端口被占用时,使用其他端口
- 企业网络使用非标准端口以避免防火墙限制
- 环境匹配匹配现有的开发端口约定
环境变量支持:
# Direct Node.js execution with custom port
PORT=8080 node src/backend/server.js
# NPM script with custom port
PORT=8080 npm start🌐 自动打开功能当您启动服务器时,仪表板会自动在您的浏览器中打开(使用 --no-open (以禁用)
📖 书籍 有关详细的服务器管理说明,请参阅 docs/SERVER_GUIDE.md 翻译为中文是:docs/服务器指南.md
管理MCP服务器
一旦仪表板开始运行:
- 查看所有已配置服务器及其当前状态
- 点击单个服务器卡上的启用/禁用按钮
- 使用“全部启用”或“全部禁用”进行批量操作
- 点击“刷新”以从磁盘重新加载配置
键盘快捷键
Ctrl/Cmd + R刷新服务器Ctrl/Cmd + E启用所有服务器Ctrl/Cmd + D禁用所有服务器
API 端点
后端服务器提供以下REST API端点:
GET /api/mcp-config读取当前的MCP配置POST /api/mcp-config更新MCP配置POST /api/validate-config在保存配置前进行验证GET /api/health检查服务器健康状态
文件结构
q-mcp-manager/
├── src/
│ ├── backend/
│ │ └── server.js # Express.js server
│ ├── frontend/
│ │ ├── dashboard/ # Main dashboard
│ │ │ ├── index.html
│ │ │ ├── script.js
│ │ │ └── styles.css
│ │ └── home/ # Home launcher
│ │ ├── index.html
│ │ ├── script.js
│ │ └── styles.css
│ └── assets/ # Static assets & screenshots
│ ├── launcher.html
│ ├── start.html
│ ├── Screenshot_1.png # Light mode dashboard
│ └── Screenshot_2.png # Dark mode dashboard
├── scripts/
│ └── server.sh # Main server control script
├── docs/
│ ├── QUICK_START.md # Quick start guide
│ └── SERVER_GUIDE.md # Detailed server guide
├── logs/ # Server logs (auto-generated)
├── start.sh # Convenience startup script
├── package.json # Node.js dependencies
├── CONTRIBUTING.md # Development guidelines
├── LICENSE # MIT License
├── README.md # This file
└── .gitignore # Git ignore rules配置文件格式
仪表板支持标准的Amazon Q MCP配置格式:
{
"mcpServers": {
"server-name": {
"command": "docker",
"args": ["run", "--rm", "--interactive", "image:latest"],
"env": {},
"disabled": false,
"autoApprove": []
}
}
}安全特性
- 自动备份在做出更改前创建带有时间戳的备份
- 配置验证在保存前验证JSON结构
- 错误处理全面的错误处理,配备用户友好的提示信息
- 实时状态显示连接状态和加载状态
故障排除
服务器无法启动
- 确保已安装 Node.js:
node --version - 检查端口3000是否可用:
lsof -i :3000 - 安装依赖项:
npm install
无法读取MCP配置
- 验证文件是否存在:
ls -la ~/.aws/amazonq/mcp.json - 检查文件权限:
chmod 644 ~/.aws/amazonq/mcp.json - 验证JSON语法:
cat ~/.aws/amazonq/mcp.json | jq .
更改未生效
- 点击“刷新”按钮从磁盘重新加载
- 检查浏览器控制台中的错误信息
- 验证后端服务器是否正在运行
发展
要为仪表板做出贡献或进行修改:
- 前端更改编辑
index.html,styles.css,或者script.js - 后端变更编辑
server.js - 使用开发模式:
npm run dev用于自动重载
安全注意事项
- 仪表板在您的本地机器上运行
- 仅可通过本地主机访问(不对外网开放)
- 在进行任何更改之前创建备份
- 在应用之前验证所有配置更改
许可证
MIT 许可证 - 欢迎根据需要自由修改和分发。
支持
如果您遇到任何问题:
- 检查浏览器控制台中的错误信息
- 验证您的MCP配置文件是否为有效的JSON格式
- 确保后端服务器正在3000端口上运行
- 检查MCP配置文件的文件权限
