一、引言与业务背景:大模型落地的“最后一公里”安全之痛
随着大语言模型 (LLM) 与自主智能体 (Autonomous AI Agents) 在政企、金融与工业研发场景的爆发式普及,AI 的核心工作流正由“单一对话生成”全面演进为“调用外部工具操作生产世界”。2024 年 Anthropic 推出的 模型上下文协议 (Model Context Protocol, 简称 MCP) 正在迅速统一 Agent 与异构工具系统之间的互联标准。
然而,企业在生产环境中直接引入开源 MCP 工具生态时,正面临沙箱隔离缺失导致远程代码执行 (RCE)、异构厂商协议转换复杂、高并发调用雪崩超时、高危敏感操作缺乏人机审批 (HITL) 以及调用资产缺乏分布式 TraceID 审计等严峻痛点。为此,我们设计并研发了这套企业级 基于 Vue3 + Go 的 MCP 插件沙箱编排与模型上下文协议安全网关系统。
二、三端一体化系统总体架构与技术全景
| 系统分层 | 核心技术选型 | 关键职责与业务价值 |
|---|---|---|
| 表现交互层 | Vue 3.4 + Pinia + Vite 5 + Element Plus | PC 编排工作台、手机移动端 H5 审批、Admin 全景大屏三端一体 |
| 拓扑渲染引擎 | HTML5 Canvas 2D 发光贝塞尔光导 | 零第三方重量级依赖,支持 50+ 节点高保真发光动效流转 |
| 隔离执行沙箱 | WebAssembly (Wasmtime) + gVisor / Docker | 微内核硬件级隔离,Syscall 系统调用白名单 100% 拦截注入 |
| 协议调度网关 | Go 高性能连接池 + JSON-RPC 2.0 / SSE | 微秒级自适应令牌桶限流与超时降级断路器 (Circuit Breaker) |
三、PC 电脑端核心功能与高保真原型全景解析
3.1 MCP 插件与安全沙箱 DAG 可视化编排工作台
AI 架构师可在 PC 端自由拖拽预置 MCP 插件库(只读数据库、Python 隔离计算、Puppeteer 网页采集、Docker 控制面、金融划扣网关等),主舞台基于原生 HTML5 Canvas 2D 绘制发光贝塞尔曲线,直观呈现从“意图输入 ➔ AST 安全检测 ➔ 人机审批拦截 ➔ 沙箱调度 ➔ 目标 Server ➔ 脱敏输出”的完整数据流,右侧抽屉支持对 CPU 硬限制、内存熔断与超时参数进行秒级热重载。

3.2 企业级多厂商 MCP 插件市场与 JSON Schema 规范
统一纳管 12 款主流企业级 MCP 安全插件,严格遵循 Anthropic 标准协议定义。各插件清晰标注 L1/L2/L3 风险定级,并支持一键查看标准化 JSON-RPC 2.0 Tool Schema 结构与分配沙箱微容器。

3.3 JSON-RPC 2.0 协议双向交互与 SSE 流式打字机实验室
左侧为标准化 JSON-RPC 报文编辑器,右侧支持 SSE (Server-Sent Events) 打字机高拟真流式回传,实时解构大模型思维链 (CoT)、Wasm 调度日志及脱敏后 Payload,并在底部清晰度量 TCP 握手时延、AST 安全扫描用时与 Token 消耗。

3.4 Wasm / 容器安全沙箱实例生命周期控制台
为每个异构 MCP Server 分配轻量级隔离容器(Wasmtime、Go-MicroContainer、gVisor 等),严密监控 CPU 占用率、内存硬上限与系统调用 (Syscall) 拦截流水,支持异常实例毫秒级热重启与内存配额重置。

3.5 动态安全合规策略与注入防御配置
集成 AST 抽象语法树分析与正则引擎,精准阻断 DROP TABLE / DELETE 恶意变更、Shell 提权命令注入与敏感路径越权,同时对身份证号、手机号、银行账户等 PII 数据自动实施掩码脱敏。

3.6 分布式 TraceID 级工具调用链路瀑布图
支持按全局分布式 TraceID 穿透追踪每一次外部工具调用的各环节耗时,通过甘特瀑布图直观分析网关路由、策略扫描、沙箱冷/热启动与目标工具执行各阶段的微秒级性能瓶颈。

四、运营管理 Admin NOC 安全控制大屏
4.1 全景网关监控与高频工具吞吐大屏
运营后台基于 ECharts 5.5 定制极客暗黑风大屏,涵盖网关实时吞吐 QPS (1,420)、24 小时吞吐与 P99 延迟双轴时序走势、多厂商工具调用分类南丁格尔玫瑰图以及今日高频工具排行榜。

4.2 MCP Server 注册中心与服务心跳巡检

4.3 多租户并发限流与超时降级容灾矩阵

4.4 多云凭证密钥脱敏保密柜 (KMS 集成) 与金融级合规审计


五、手机移动端 H5 掌上风控与人机回环 (HITL) 秒级审批
为满足移动化办公与高敏事件即时响应诉求,系统配备了完整的手机 H5 端应用。内置灵动岛拟真交互、网关运行健康快报、高危动作(涉及生产环境重启或大额资金划扣)秒级掌上生物识别一键审批与违规 API Key 紧急熔断。
移动端网关健康快报
移动端高危人机审批中心
实时风控告警流
个人权限与配额中心
六、项目源码与完整 PRD 交付说明
本项目包含整套生产级三端一体化高保真前端工程源码、标准企业级 PRD 需求规格说明书 (v2.5.0 Enterprise Pro Max)、HTML5 Canvas 2D 贝塞尔光导编排引擎以及 ECharts 5.5 大屏组件。您可以通过本文顶部的加密链接一键保存并下载完整源码包,并在本地通过 npm run dev 或 npm run build 秒级启动与体验。
