前言

在上一篇文章 《使用 MCP Server 构建企业信息查询工具:集成企查查 API》 中,我们介绍了如何从零开始构建一个集成了企查查商业数据的 MCP Server,并让 AI 助手(如 Cherry Studio)具备了查询企业工商信息的能力。

然而,在实际推广过程中,我们发现了一个影响用户体验的痛点:手动配置太繁琐,且效果不完美。

痛点:手动配置 VS 自动接入

当用户想要在 Cherry Studio 中使用我们开发的 MCP 服务时,通常需要手动填写配置。

方式一:手动填写(现状)
用户需要自己输入 Server 名称、Transport 类型、URL 地址,甚至还需要手动去寻找 Logo 图片链接。如果用户偷懒少填了信息,最终在 Cherry Studio 里的呈现效果往往是这样的:

在这里插入图片描述

(图1:缺少图标、描述和标签,看起来非常简陋,难以区分功能)

方式二:理想效果
我们希望用户看到的,是信息完善、带有官方品牌标识、功能描述清晰的卡片,如下图所示:

在这里插入图片描述

(图2:包含 Logo、详细描述、标签分类,专业且信任感强)

为了达到图2的效果,难道要逼着用户去复制粘贴几十个字段吗?

当然不需要。今天我们将介绍一种基于 Deep Link(深度链接)的解决方案 —— Protocol Launcher,它能让开发者为用户生成“一键安装”链接,自动完成所有复杂的配置工作。

什么是 Protocol Launcher?

Protocol Launcher 是一个类型安全、可扩展的深度链接生成工具。简单来说,它可以生成一个特殊的 URL,当用户点击这个 URL 时,会自动唤起 Cherry Studio 并将我们预设好的 MCP Server 配置(包括图标、描述、鉴权头等)自动填入。

它具有以下优势:

  • 类型安全:基于 TypeScript,避免配置字段拼写错误。
  • 零依赖:轻量级,不增加项目负担。
  • 按需加载/树摇:仅按需导入所需功能,减小打包体积。
  • 安全编码:对配置进行安全编码,避免注入。完美支持中文等 Unicode 字符。
  • ESM 优先:现代 ES Modules,适配 Node 与各类打包器。
  • 体验极佳:用户只需点击一下,即可完成配置。

实战:为企查查 MCP 生成一键安装链接

下面我们演示如何在企查查的介绍网页或文档中,集成 Protocol Launcher。

1. 安装依赖

首先,在你的前端项目或脚本中安装 protocol-launcher

npm install protocol-launcher

2. 编写配置代码

我们需要使用 installMCP 方法来生成安装链接。这里我们以“企查查企业信息”和“企查查风险信息”两个服务为例。

请注意,这里我们可以把图标 (logoUrl)详细描述 (description)服务商信息 (provider) 全部预设好,确保用户安装后的界面精美。

import { installMCP } from 'protocol-launcher/cherry-studio'

// 生成“一键安装”链接
const installUrl = installMCP({
  mcpServers: {
    'qcc-company-basic-stream': {
      name: '企查查企业信息 MCP',
      description:
        '企业信息 MCP 提供全面的企业画像分析与企业信息洞察服务,助您快速验证企业真实性、评估其稳定性和发展轨迹,为您的商业行动提供坚实的数据支撑。',
      type: 'streamableHttp', // 使用流式 HTTP 传输
      baseUrl: 'https://mcp.qcc.com/basic/stream',
      headers: {
        // 这里的 Token 仅作示例,实际生产环境建议引导用户填入自己的 Key 或使用代理服务
        Authorization: 'YOUR_API_KEY_OR_TOKEN', 
      },
      provider: 'QCC',
      providerUrl: 'https://openapi.qcc.com/mcpTools?service=basic',
      logoUrl: 'https://openapi.qcc.com/favicon.ico', // 关键:自动配置官方 Logo
      tags: ['company-basic', '企业信息'],
      timeout: 30,
    },
    'qcc-company-risk-sse': {
      name: '企查查风险信息 MCP',
      description:
        '风险信息 MCP 提供全面的企业风险透视扫描能力,可识别企业在司法、行政、经营等方面的信用与合规隐患。',
      type: 'sse', // 使用 SSE 传输
      baseUrl: 'https://mcp.qcc.com/basic/sse',
      headers: {
        Authorization: 'YOUR_API_KEY_OR_TOKEN',
      },
      provider: 'QCC',
      providerUrl: 'https://openapi.qcc.com/mcpTools?service=risk',
      logoUrl: 'https://openapi.qcc.com/favicon.ico',
      tags: ['company-risk', '风险信息'],
      timeout: 30,
    },
  },
})

console.log('一键安装链接已生成:', installUrl)

3. 在网页中使用

将生成的 installUrl 绑定到一个按钮上:

<a href={installUrl} className="btn-primary">
  <img src="https://cherry-studio.com/logo.png" alt="Cherry Studio" />
  添加至 Cherry Studio
</a>

最终效果

当用户点击网页上的“添加至 Cherry Studio”按钮时:

  1. 浏览器会自动唤起 Cherry Studio 客户端。
  2. 客户端弹出“导入 MCP 服务器”确认框。
  3. 用户确认后,企查查的 MCP 服务即刻添加成功,且自带官方 Logo、详细的功能介绍和清晰的标签分类(如本文开头图2所示)。

总结

通过引入 protocol-launcher,我们不仅简化了用户的接入流程,更重要的是规范了 MCP 服务在客户端中的呈现样式。对于企查查这样专业的 API 服务商来说,一个通过 Logo 和详细文案包装过的 MCP 服务,显然比用户手动乱填的配置更具专业度和信任感。

相关资源:

Logo

有“AI”的1024 = 2048,欢迎大家加入2048 AI社区

更多推荐