微信 SDK + Senparc.AI + MCP 打造微信 AI 开发助手(一):网页版

概述

在另外一个《Senparc.AI 系列教程》(Senparc.AI 系列教程(一):概要Senparc.AI 系列教程(二):配置大模型,开始开发应用)中简要介绍了 Senparc.AI 所支撑的底层能力(持续更新中),从这个系列开始,我们将逐步探索其强大的扩展和落地能力。

本文介绍的案例中,我们使用微信 SDK,借助 Senparc.AI,结合 MCP,打通了微信接口的自动搜索和代码生成,使开发者可以在网页、IDE,甚至 Dfiy、n8n 等框架中高效开发或让微信程序自动化运行。

微信的案例我将分为(上)(中)(下)三篇,分别介绍网页版助手IDE 端 AI 辅助编程 ,以及参与到工作流的智能体互动中。

案例资源

当前展示的案例已经全部开源(可商用),可在 https://sdk.weixin.senparc.com 在线体验,同时也支持本地部署,涉及到的开源项目如下:

  1. 微信 SDK:https://github.com/JeffreySu/WeiXinMPSDK
  2. NeuCharFramework:
    源码:https://github.com/NeuCharFramework/NcfPackageSources
    可直接运行的模板:https://github.com/NeuCharFramework/NCF (桌面版下载:https://github.com/NeuCharFramework/NCF/releases
  3. QQ 交流群:553198593

本文的网页版案例主要集中在微信 SDK。

案例功能介绍(网页版助手)

这个工具的诞生,源于目前 AI 编程的巨大痛点:即使大模型已经学习了大量编程知识,但是对于特定 SDK 内部编程接口的幻觉依然非常严重,准确率低。而各类 SDK,尤其 API 的对接精准度要求通常又比较高,所以光使用大模型辅助编程效率仍然很低,经常发生的情况是:生成 3 分钟,修改 3 小时

尤其对于 SDK 类型和基础库,程序能否成功运行,高度依赖方法生成的准确性,否则一旦出现任何问题,开发人员需要花费更多的时间重新阅读文档、研究接口、排查错误,修复错误,痛苦不堪。

为此我们推出了基于 MCP 的整体解决方案,当前章节主要介绍网页版。

先上效果,然后我们再分析原理。

打开页面(或从微信 SDK 开源项目下载到本地): https://sdk.weixin.senparc.com,在首页即可看到 AI 助手(或从顶部菜单【工具箱】>【AI 开发助手】进入):

输入你想实现的功能:

稍等片刻,即可收到 AI 助手回复:

AI 回复内容中包含了自动识别的模块(公众号/小程序/企业微信/开放平台等),以及接口的说明、可直接复制使用的代码示例以及使用提示,同时也可以点击"接口参数说明",查看每个参数详细的介绍:

当然你可以对此并不满意,并且提出了更加复杂的需求,AI 也会回你自动生成精准代码。点击编辑图标:

重新编辑内容:

发送并获取结果:

如果代码中包含了多个接口,相关参数也一览无余:

至此,AI 已经帮你完成了大部分的关键接口开发,至少省掉了几个小时的接口研究和测试(接口调用是非常精准的)。

小彩蛋:你可以要求 AI 使用异步方法,看看是否能同样能准确响应。

原理解析

先上图:

关键过程解析

服务起始于2.1 处理请求并连接 MCP 服务 ,相关任务提交至位于 Sample 的 AiDocController 中的 ProcessQuery() 方法中,随后尝试连接 MCP 服务并获取工具列表(tool-list)(图中 3.1),核心代码如下:

复制代码
 1 //建立 MCP 连接,并获取信息
 2 var mcpEndpoint = "https://www.ncf.pub/mcp-senparc-xncf-weixinmanager/sse";
 3 var clientTransport = new SseClientTransport(new SseClientTransportOptions()
 4 {
 5     Endpoint = new Uri(mcpEndpoint),
 6     Name = "NCF-Server"
 7 });
 8 
 9 var client = await McpClientFactory.CreateAsync(clientTransport);
10 var tools = await client.ListToolsAsync();

上述 mcpEndpoint 所对应的 Server 中,部署了一系列为 AI 助手服务的 MCP 工具(原理在后续章节介绍)。

获取到 tools 后(图中 2.2),我们使用 Senparc.AI 完成请求基础配置(图中 2.3),并发起一个 AI 请求(图中 2.4):

复制代码
 1 var aiSetting = Senparc.AI.Config.SenparcAiSetting;
 2 var semanticAiHandler = new SemanticAiHandler(aiSetting);
 3 
 4 var parameter = new PromptConfigParameter()
 5 {
 6     MaxTokens = 2000,
 7     Temperature = 0.7,
 8     TopP = 0.5,
 9     StopSequences = new List<string> { "<END>" }
10 };
11 
12 var systemMessage = $@"你是一位智能助手,帮我选择最适合的 API 方案。";
13 
14 var iWantToRun = semanticAiHandler.ChatConfig(parameter,
15     userId: "Jeffrey",
16     maxHistoryStore:  10,
17     chatSystemMessage: systemMessage,
18     senparcAiSetting: aiSetting,
19     kernelBuilderAction: kh =>
20     {
21         // kh.Plugins.AddMcpFunctionsFromSseServerAsync("NCF-Server", "http://localhost:5000/sse/sse");
22         kh.Plugins.AddFromFunctions("WeixinMpRouter", tools.Select(z => z.AsKernelFunction()));
23     }
24         );
25 var executionSettings = new OpenAIPromptExecutionSettings
26 {
27     Temperature = 0,
28     FunctionChoiceBehavior = FunctionChoiceBehavior.Auto()
29 };
30 var ka = new KernelArguments(executionSettings) { };
31 
32 var prompt = $@"...";//发送到 AI 的要求
33 //输出结果
34 var resultRaw = await iWantToRun.Kernel.InvokePromptAsync(prompt, ka);

上述代码中:

  • 相关 AI 配置需要提前完成,参考《Senparc.AI 系列教程(二):配置大模型,开始开发应用》)
  • 第 1 行:使用 Senparc.AI.Config.SenparcAiSetting 对象获取到当前默认 AI 模型配置。
  • 第 2 行:构建 SemanticAiHandler 对象,构造函数中的 aiSetting 如果传入 null,则会默认从 Senparc.AI.Config.SenparcAiSetting 获取(所以示例代码中的效果等同于传入 null,只是为了做演示)。如果这里希望使用 appsettings.json 默认配置意外的模型,那么可以在这里进行修改。
  • 第 4-10 行:进行模型参数配置。
  • 第 12-30 行(图中 2.3):完成 Senparc.AI 中另外一个重要对象:IWantToRun 的构建,相关代码完成了一个 Chat(聊天)场景的配置(注意:使用 MCP 或者 function-calling 推荐使用 Chat 模式,而不是 Completion 模式)。
  • 第 28 行:这里设置 FunctionChoiceBehavior 非常重要,否则模型不一定会执行 function-calling 或 MCP(本质上还是 function-calling 同样的原理),这里根据需要,我默认选择了 FunctionChoiceBehavior.Auto(),如果需要每次都强制调用工具,那么可以设置为 FunctionChoiceBehavior.Required()。
  • 第 32 行:需要传入 AI 的 Prompt,由于内容比较多,此处略,可以参考源码,其中包含了大量提示词工程的经验。
  • 第 34 行:发送获取结果(图中 2.4-2.7)。
  • 后续部分都是 UI 渲染相关。

MCP 服务

上述过程中的 MCP 服务,部署到了一个独立站点中(即代码中的 mcpEndpoint:https://www.ncf.pub/mcp-senparc-xncf-weixinmanager/sse),您可以尝试打开这个连接,将会看到一个 SSE 连接的内容,如:

这说明这个 SSE 的链接同样可以被 Cursor、GitHub Copilot 等 IDE 和工具所使用(我们会在下一篇文章中具体介绍)。

这个 MCP Server 的服务由 NeuCharFramework 框架自动生成(无需编写额外代码),其中的工具(Tools)则是由 Senparc.Xncf.WeixinManager 模块提供。

这个模块中又引用了微信 SDK 的 Senparc.Weixin.AspNet 包,其中使用到了我设计的名为 McpRouter 的一种模式:先对资源进行分类,然后通过 NextRoundTip 指定下一级运行的路由指令,达到了 AI 动态生成和工作流的融合,同时又摆脱了传统 Planner 过早制定完整计划的弊端,以及过多 Tools 对于 MCP 调用的压力(Cursor 推荐 40 个以内,而光微信拥有上千个 API,如果同时给到 MCP 将是一场灾难)。

相关 MCP 方法提供了微信 SDK 中不同层级接口的信息,并根据 AI 的 MCP 请求动态输出。

上述方法有效弥补了纯靠 AI 生成代码可能出现幻觉的问题,由于 MCP 返回的是精准 SDK 中的方法信息,因此准确度得到了大幅提升。

后续

  1. 上述展示了 McpRouter 模式在网页端的强大能力,下一篇,我们将介绍使用相同的 MCP 工具,在 Cursor、VS Code 等 IDE 中直接编写代码。
  2. 接下去,我们也将在微信 McpRouter 的基础上,进行升级和抽象重构,使其可以服务于更多的 SDK 和基础库,实现更大程度的编程效率、准确性的提升。