mcp应用程序渲染器
可重用的HTML渲染器 MCP应用程序协议 --在支持MCP的客户端中呈现为沙盒iframe的交互式、自包含的UI。
状态： 存档的原型。功能齐全，但已提取以供将来重用。\ 产地： 原型 doobidoo/mcp-memory-service --未合并，因为该服务已提供完整的Web仪表板。\ 目标用例： 具有以下功能的MCP服务器 *不* 现有的用户界面，并受益于内联工具输出可视化（Azure成本仪表板、部署状态、CI/CD管道等）
MCP应用程序协议
MCP应用程序当前处于 内部人模式 （VS代码内部人员+ chat.mcp.apps.enabled: true).主机渲染 EmbeddedResource(mimeType="text/html") 直接在聊天中以沙盒iframe的形式进行响应。
from mcp.types import EmbeddedResource, TextResourceContents
return EmbeddedResource(
type="resource",
resource=TextResourceContents(
uri="mcp-apps://ui/my-tool",
mimeType="text/html",
text="...",
),
)包含什么
mcp_apps/
__init__.py # Public API
renderer.py # HTML renderer (dark theme, self-contained CSS/JS)
example_test.py # Local test — renders 5 HTML files to /tmp/提供渲染器
| 功能 | 输出 |
|---|---|
render_memory_search_results(memories, query) | 带有相似性分数徽章、标签、复制哈希按钮的卡片列表 |
render_memory_list(result) | 分页内存浏览器 |
render_health_dashboard(health) | 统计网格+详细行+错误状态 |
如果满足以下条件，所有渲染器都会返回原始HTML字符串 mcp 未安装。
用法
import os
os.environ["MCP_APPS_ENABLED"] = "true"
from mcp_apps import mcp_apps_enabled, render_health_dashboard
@mcp.tool()
def check_health() -> Any:
result = get_health() # your logic
if mcp_apps_enabled():
return render_health_dashboard(result)
return result本地测试
pip install mcp # optional
python example_test.py
open /tmp/mcp_apps_search.html设计
- 黑暗主题（Catppuccin风格的调色板）
- 零外部依赖——在严格的沙盒iframe中工作
- 分数徽章：绿色≥0.75，黄色≥0.50，红色\<0.50
- 复制到剪贴板以获取内容哈希值
- 展开/折叠长内容
在其他项目中重复使用
这 _CSS, _base_page，以及 _wrap 助手是通用的。要适应不同的MCP工具：
- 复制
mcp_apps/进入你的项目 - 写一个新
render_*使用现有HTML原语的函数 - 返回您的结果
@mcp.tool()当mcp_apps_enabled()
许可证
麻省理工学院