企业售后 MCP 实战（下）：长任务、MCP Apps 与 Agent Host

上一小节咱们从 npm run host 开始，顺着 agent-host.js 来讲。

到现在大家应该已经理解 Host 是怎么携带身份连接 Server、怎么发现当前用户可以使用的能力，以及查询订单、退款预审、MRTR 确认和幂等写入到底是怎么执行的。

但是，上一小节咱们看的都是命令行操作。

除了命令行之外，咱们还得看 web-host 的可视化操作部分。

这就是咱们这一小节要做的

从 npm run web-host 进入项目

保持 MCP Server 运行。

执行：

npm run web-host

终端会打印两个地址：

MCP Apps Web Host：http://127.0.0.1:3200
MCP Apps Sandbox：http://127.0.0.1:3201

先打开第一个：

http://127.0.0.1:3200

这个就是项目的浏览器版 Agent Host。

至于第二个 Sandbox 先不用管。它并不是给用户直接访问的页面，等后面真正加载 MCP App 时，咱们再看它是干什么的。

先回到代码。

package.json 中的 web-host 指令是：

{
	"scripts": {
		"web-host": "node --env-file-if-exists=.env src/web-host-server.js"
	}
}

所以，Node 服务的入口是：src/web-host-server.js

这个文件会启动两个 HTTP Server。

其中，3200 端口负责浏览器里的 Agent Host，3201 端口负责后面加载 MCP App 的隔离环境。

浏览器打开页面以后，还会执行 src/web-host/main.js 中的 main()：

它会读取页面配置，然后按照当前选择的身份连接 MCP Server，获取这个身份能够发现的 Tools。

做到这里，浏览器版 Host 就启动完成了。

接下来，点击左侧的：一键演示 MCP App

页面会切换成蓝鲸科技财务身份，并提示是否确认启动三笔订单的批量退款审核。

先别急着点确认。

咱们现在就从这个按钮开始追代码。

点击按钮以后，程序从哪里开始执行

按钮的点击事件在 src/web-host/main.js 里面，点击之后会触发 runDeterministicAppDemo 方法：

这个方法就