麦克普前端界面
项目介绍
⚡ MCPO配置管理器
用于管理MCPO（模型上下文协议到OpenAPI）服务器的Web界面。
特性
- 🎨 双输入模式 - 表单界面和JSON编辑器
- 🔄 自动重载 - 配置更改会自动重启MCPO（内置监视器）
- 🐳 Docker就绪 - 单容器，单个
docker-compose up命令 - ⚡ 通用运行时 - 支持uvx、npx和docker命令
- 🛡️ 安全默认设置 - 始终至少维护一个服务器（防止崩溃）
- 🔐 身份验证 - 可选的HTTP基本认证通过Caddy + MCPO API密钥保护
快速开始
# 1. 设置环境变量
cp .env.example .env
# 编辑.env并设置MCPO_API_KEY（必需）
# 2. 启动服务
docker-compose up -d
# 3. 访问UI
open http://localhost
# 4. 查看MCPO API文档
open http://localhost:8000/<server-name>/docs
您将获得：
- UI: http://localhost (端口80)
- MCPO API: http://localhost:8000
- 包含默认时间服务器（可以删除或替换）
- 配置更改后自动重启
服务器类型
UI支持三种类型的MCP服务器：
| 类型 | 描述 | 示例用例 |
|---|---|---|
| STDIO | 命令行工具 | Python/Node.js MCP服务器 |
| SSE | 服务器发送事件 | 远程HTTP端点 |
| 可流式传输HTTP | HTTP流式传输 | 自定义流式传输服务器 |
配置示例
<details> <summary><b>STDIO服务器（uvx, npx, docker）</b></summary>{
"mcpServers": {
"time": {
"command": "uvx",
"args": ["mcp-server-time", "--local-timezone=America/New_York"]
},
"memory": {
"command": "npx",
"args": ["-y", "@modelcontextprotocol/server-memory"]
},
"docker-example": {
"command": "docker",
"args": ["run", "-i", "--rm", "mcp/time"]
}
}
}
{
"mcpServers": {
"remote-sse": {
"type": "sse",
"url": "http://127.0.0.1:8001/sse",
"headers": {
"Authorization": "Bearer token"
}
}
}
}
{
"mcpServers": {
"http-stream": {
"type": "streamable-http",
"url": "http://127.0.0.1:8002/mcp"
}
}
}
架构
单容器，三个进程：
- Caddy (端口80) - 反向代理，可选HTTP基本认证
- Streamlit UI (localhost:8501) - 管理配置的Web界面
- MCPO服务器 (端口8000) - 将MCP服务器作为OpenAPI暴露的代理
- 内置监视器 - 监视
/config目录，在更改时重启MCPO
┌─────────────────────────────────────┐
│ 容器 (mcpo-ui) │
│ │
│ ┌─────────┐ ┌─────────────┐ │
│ │Caddy:80 │────>│Streamlit │ │
│ │(+auth) │ │localhost:8501│ │
│ └─────────┘ └──────┬──────┘ │
│ │ │
│ ▼ │
│ config.json │
│ │ │
│ ▼ │
│ ┌──────────┐ │
│ │MCPO:8000 │ │
│ └──────────┘ │
│ (自动重启) │
└─────────────────────────────────────┘
运行多个实例
# 复制项目到新目录
cp -r . ../instance2
cd ../instance2
# 创建具有不同端口和容器名称的.env
cat > .env <<EOF
CONTAINER_NAME=mcpo-ui-2
UI_PORT=8080
MCPO_PORT=8001
MCPO_API_KEY=different-api-key
EOF
# 启动第二个实例
docker-compose up -d
环境变量（参见.env.example）：
MCPO_API_KEY: MCPO身份验证的API密钥（必需）CONTAINER_NAME: 容器名称（默认：mcpo-ui）UI_PORT: UI访问的HTTP端口（默认：80）MCPO_PORT: MCPO API端口（默认：8000）MCPO_BASE_URL: 浏览器访问的基本URL（可选，用于反向代理设置）UI_USERNAME: HTTP基本认证用户名（可选）UI_PASSWORD_HASH: HTTP基本认证密码哈希（可选）
安全性
UI身份验证（可选）：
UI包括带有可选HTTP基本认证的Caddy反向代理：
# 1. 生成密码哈希（自动转义为.env）
docker run --rm caddy caddy hash-password --plaintext yourpassword | sed 's/\$/\$\$/g'
# 2. 添加到.env（使用上面的转义输出）
UI_USERNAME=admin
UI_PASSWORD_HASH=$$2a$$14$$...
# 3. 重启容器
docker-compose restart
留空UI_USERNAME和UI_PASSWORD_HASH以禁用身份验证。
替代身份验证选项：
- Coolify - 在服务设置中启用内置HTTP基本认证（如果使用Coolify）
- 外部反向代理 - 使用nginx/Traefik进行认证
- VPN/防火墙 - 仅限信任IP访问网络
API身份验证：
MCPO端点由MCPO_API_KEY保护 - 生产环境中始终设置此密钥！
故障排除
<details> <summary><b>服务器返回404</b></summary>MCPO不在服务器根目录提供内容。通过以下方式访问工具：
- 文档：
http://localhost:8000/<server-name>/docs - 工具：
http://localhost:8000/<server-name>/<tool-name>(POST)
# ✅ 查看文档
curl http://localhost:8000/time/docs
# ✅ 调用工具
curl -X POST http://localhost:8000/time/get_current_time \
-H "Content-Type: application/json" \
-d '{"timezone": "America/New_York"}'
# 检查监视器日志
docker logs <watcher-container-name>
# 手动重启
docker restart <mcpo-container-name>
# 将用户添加到docker组
sudo usermod -aG docker $USER
newgrp docker
# 查看日志
docker-compose logs -f
# 重新构建
docker-compose up -d --build
项目结构：
├── ui/ # Streamlit UI源文件
│ ├── app.py # 主UI应用程序
│ ├── config.example.json # 默认配置模板
│ └── requirements.txt # Python依赖项
├── Caddyfile # Caddy反向代理配置（HTTP基本认证）
├── entrypoint.sh # 容器入口点（管理所有进程）
├── Dockerfile # 单一镜像，包含Caddy + UI + MCPO + 监视器
├── docker-compose.yml # 开发设置
├── docker-compose.prod.yml # 生产设置
└── config/ # config.json卷（自动创建）
生产部署
使用GitHub容器注册表中的预构建镜像：
# 使用docker-compose.prod.yml
docker compose -f docker-compose.prod.yml pull
docker compose -f docker-compose.prod.yml up -d
镜像： ghcr.io/tonghualabs/mcpo-ui:latest