Persona.js

要在网页里加一个能真正干活的 AI 聊天面板，今天的做法远比想象中繁琐。开发者通常先引入一个聊天 UI 库，或者手写消息列表和输入框，再接上 OpenAI 或 Anthropic 的 API，处理流式响应、错误重试和上下文管理。如果想让 AI 不止聊天，还能查数据库、操作 DOM、调用内部 API，就得自己实现函数调用循环：定义工具 schema，解析模型返回的 tool_call，执行函数，把结果塞回消息里再请求模型，循环直到模型给出最终文本。每一步都要处理状态同步和 UI 反馈，而且不同模型的 tool calling 格式还不完全一致。等把这些都调通，项目已经拖了好几天。

Persona.js 切入的正是这一层：前端 AI 聊天组件与 MCP 工具协议之间的接线层。它提供一个现成的聊天界面，原生支持 WebMCP，开发者只需要传入 MCP 服务器端点，组件就会自动发现可用工具，并在对话中完成工具调用循环。用户在前端看到的就是一个能直接执行任务的聊天框，比如“把这条记录的状态改成已发货”或者“导出上个月的销售报表”，AI 会调用对应的 MCP 工具去完成，而不是只给一段代码让用户自己跑。

旧方案之所以不够好，不是因为缺组件库。Vercel AI SDK 已经封装了流式处理和工具调用，但它仍然要求开发者自己管理工具注册、处理不同模型的差异，并且 MCP 集成需要额外写适配层。直接用 OpenAI API 或 Anthropic API 更底层，连消息管理都要自己写。这些方案把协议适配和 UI 状态管理的复杂度全部留给了开发者，而大多数前端团队并不想深入理解 MCP 的传输...