使用 MCP 增强 Copilot 代理模式

了解如何使用模型上下文协议 (MCP) 扩展 Copilot 对话助手 的代理功能。

本文内容

注意

  • MCP 支持在 Copilot 对话助手 for Visual Studio Code 中正式发布 (GA)。
  • Visual Studio、JetBrains、Eclipse 和 Xcode 中的 Copilot 的 MCP 支持为 公共预览版，可能会随时更改。
  • “GitHub 预发行许可条款”适用于你对本产品的使用。

关于 Copilot 的代理功能和 MCP

Copilot 的代理功能是指能够独立工作（无需持续指导即可执行多步骤工作流）、做出决策（根据上下文选择适当的工具和方法）、迭代和调整（根据反馈和结果调整其方法）。************ 可以使用代理模式访问这些功能。

与模型上下文协议 (MCP) 服务器结合使用时，代理模式的能力将显著增强，使 Copilot 能够在不切换上下文的情况下访问外部资源。 这使得 Copilot 能够完成代理“循环”- 可通过自主查找相关信息、分析反馈和做出明智决策来动态调整其方法。 借助 MCP，Copilot 可在极少人工干预的情况下完成任务，根据发现的信息持续调整其策略。

将 MCP 与代理模式相结合的优势

将 MCP 服务器与代理模式结合使用时，可解锁几项关键优势：

  • 扩展上下文：MCP 服务器向 Copilot 提供对外部数据源、API 和工具的访问权限。
  • 减少手动工作量：Copilot 可执行创建问题和运行工作流等任务，让你专注于更高价值的任务。
  • 无缝集成：Copilot 可处理涉及多个工具和平台的任务，无需切换上下文，也无需自定义集成。

将 MCP 与代理模式结合使用的最佳做法

遵循这些最佳做法，充分利用 MCP 服务器与代理模式的组合。

提示策略

  • 明确目标：在提示中明确定义要完成的任务，以及所需的输出。
  • 提供上下文：提供项目和要求的相关背景信息，包括 Copilot 可访问的外部资源的链接。
  • 设置边界：指定任务的任何约束或限制。 例如，如果希望 Copilot 仅规划新功能而暂不进行任何更改，请明确说明该要求。 还可限制已启用的 MCP 工具。
  • 请求确认：要求 Copilot 在继续进行重大更改之前确认其理解。
  • 使用提示文件或自定义说明：可创建提示文件或自定义说明文件，指导 Copilot 在不同 MCP 服务器上的具体行为。 请参阅“关于自定义 GitHub Copilot 聊天助手响应”。

MCP 服务器使用

  • 选择相关服务器：选择并启用符合特定工作流需求的 MCP 服务器。
  • 从简入手：在添加更复杂的集成之前，先使用一些成熟的 MCP 服务器。
  • 测试连接：在启动代理模式任务之前，确保所有 MCP 服务器正确配置且可访问。

安全注意事项

  • 在可用时使用 OAuth：对于 GitHub MCP 等 MCP 服务器，首选 OAuth 身份验证而不是 personal access tokens。 请参阅“使用 GitHub MCP 服务器”。
  • 限制权限：仅向 MCP 服务器授予任务所需的最低权限。
  • 查看连接：定期审核哪些 MCP 服务器有权访问开发环境。
  • 监视活动：跟踪 Copilot 通过 MCP 服务器执行的操作。

示例场景：实现辅助功能合规性

注意

以下场景仅用于演示可与代理模式和 MCP 服务器结合使用来端到端完成任务的模式和策略；场景、提示和响应只是示例。

假设你的团队收到反馈，它显示需要更新你的客户门户以符合最新的辅助功能标准。 你的任务是按照以下指南跨应用程序提高辅助功能：

  • 设计团队定义的规范列表。
  • 辅助功能审核后在项目存储库中创建的问题。

可通过 Copilot 代理模式利用多个 MCP 服务器有效地实现辅助功能改进。

以下场景演示如何对不同的阶段（研究、规划、实现和验证）使用单独的提示，从而使多个代理“循环”与软件开发生命周期阶段松散对齐。 该方法会创建自然检查点，让你能够在 Copilot 进入下一阶段之前查看进度、提供反馈并调整需求。

先决条件

在将代理模式与 MCP 结合使用之前，请确保：

  • 具有带 Copilot 集成和 MCP 支持的 IDE（例如 Visual Studio Code）
  • 已启用代理模式
  • 有权访问要使用的所需 MCP 服务器

设置 MCP 服务器

首先，需要配置预计 Copilot 所需的 MCP 服务器。 在此示例场景中，我们将使用：

  • GitHub MCP 服务器：配置 GitHub MCP 服务器，使 Copilot 能够访问存储库、检查代码库、研究现有问题、创建分支和管理拉取请求。 请参阅“使用 GitHub MCP 服务器”。

  • Figma MCP 服务器：配置 Figma MCP 服务器，使 Copilot 能够访问包含辅助功能规范的设计文件，例如颜色对比度要求、焦点状态和交互模式。 请参阅 Figma-Context-MCP，或者试用开放 beta 版的开发模式 MCP 服务器。

  • Playwright MCP 服务器：设置 Playwright MCP 服务器，使 Copilot 能够编写和运行自动化辅助功能测试，包括屏幕阅读器兼容性和键盘导航测试。 请参阅 mcp-playwright。

步骤 1：研究循环 - 分析辅助功能要求

提示 Copilot 分析项目中的辅助功能要求和与辅助功能相关的现有 GitHub 问题。

在提示中，包含 Figma 文件的链接。 为了使 Copilot 成功读取和分析设计规范，请在文件中选择特定节点或层，确保节点 ID 包含在 URL 中。

示例提示：I need to make our customer portal WCAG 2.1 AA compliant. Use the Figma MCP to analyze our design specifications at https://figma.com/design/DESIGN-FILE-FOR-ACCESSIBILITY-SPECS?node-id=NODE_ID for accessibility requirements. Also use the GitHub MCP to find open GitHub issues with the labels accessibility or WCAG in the customer-portal repository. Then sort them into categories and list each issue that falls under the category with the issue title and number.

来自 Copilot 的示例响应：

Copilot 应首先通过请求运行 Figma 和 GitHub MCP 服务器中的工具来进行响应。 许可后，Copilot 将分析 Figma 设计规范，搜索 GitHub 问题并将问题分类整理。

例如，Copilot 可能会根据找到多个颜色对比度相关问题，而将颜色对比度识别为一个类别。

  • 颜色对比度问题
    • 问题 #134：仪表板文本对比度低于 4.5:1
    • 问题 #156：表单错误状态不符合对比度要求

这向你提供辅助功能要求的全面概述，随后你可以让 Copilot 对这些要求进行优先级排序并创建相关计划。

步骤 2：规划循环 - 辅助功能实现策略

接下来，要求 Copilot 创建详细的实现计划。

示例提示：Based on your accessibility analysis of our Figma designs and GitHub issues, create a focused implementation plan for an immediate pull request addressing the highest priority accessibility issues. Don't make any changes yet. Also suggest follow-up issues we should create for the remaining Figma specifications.

来自 Copilot 的示例响应：

Copilot 的响应是创建一份优先级排序的实现计划，该计划侧重于对即时拉取请求具有高影响力的辅助功能问题，同时针对剩余工作提出后续问题建议。

例如，Copilot 可能会识别在颜色对比度类别中解决问题所需执行的操作。

  • 1.解决颜色对比度问题：
    • 更新 variables.scss 中的文本颜色变量，确保所有普通文本的对比度均为 4.5:1
    • 修改 DashboardCard.vue 和其他主要组件中的 UI 组件颜色，使对比度达到 3:1
    • 优先解决问题 #134（仪表板文本对比度）和问题 #156（表单错误状态）

可以要求 Copilot 根据你想要侧重的内容调整计划。 这会得到一份你满意的计划，你现在可要求 Copilot 实现该计划。

步骤 3：实现循环 - 改进辅助功能

审查计划后，提示 Copilot 开始实现辅助功能修复。

示例提示：Create a new branch and implement the critical accessibility fixes according to your proposed implementation plan. Focus on the top three categories that you identified as highest priority. Create a pull request with proper references to the issues being fixed.

来自 Copilot 的示例响应：

Copilot 的响应是执行实现计划，进行有针对性的代码更改来解决已识别的辅助功能问题并创建拉取请求。

例如，Copilot 可能会创建一个名为 fix/critical-accessibility-issues 的新分支，并进行更改来解决颜色对比度问题。

  • 解决了仪表板文本对比度问题（问题 #134）：
    • 将 src/styles/variables.scss 中的文本颜色变量从 #767676 更新为了 #595959
    • 在 DashboardCard.vue 中修改了浅灰色背景上的深色文本，确保对比度为 4.5:1

我基于这些更改打开了拉取请求 #213。

步骤 4：测试循环 - 使用 Playwright 进行辅助功能验证

你可以提示 Copilot 使用 Playwright MCP 创建和运行辅助功能测试。

示例提示：Create focused accessibility tests for the components we've updated in the pull request. Use the Playwright MCP.

来自 Copilot 的示例响应：

Copilot 的响应是开发辅助功能测试，并在必要时创建 Playwright 配置文件。

例如，Copilot 可能会围绕文本对比度创建一个测试文件。

测试实现：

  • 在 tests/accessibility/ 中创建了目标测试文件：
    • contrast.spec.ts - 验证文本对比度

创建测试后，Copilot 将要求权限来使用 Playwright MCP 中的各种工具运行测试。 请注意，Copilot 有时可能会执行你不一定要求的其他测试；可通过调整提示，使其更为严格，来阻止这种情况。

步骤 5：更新 GitHub 问题

最后，提示 Copilot 更新拉取请求中已解决的 GitHub 问题，并创建后续问题。

示例提示：Update the GitHub issues we've fixed in the pull request with comments summarizing the changes. Create the follow-up issues you suggested for the remaining accessibility work.

来自 Copilot 的示例响应：

Copilot 的响应是请求权限来使用 GitHub MCP 服务器中的必要工具。 然后，它将在 GitHub 问题中更新详细注释，并为剩余工作创建结构化的后续问题。

例如，Copilot 将在研究步骤中最初标识的颜色对比度问题中添加注释。

在问题中更新了注释：

  • 问题 #134：“仪表板文本对比度低于 4.5:1”
    • 注释：“通过在 variables.scss 和 DashboardCard 组件中更新文本颜色变量来修复拉取请求 #213。 现在，所有仪表板文本的对比度均为 4.5:1，这通过自动测试得到验证。”

现在，你可以审查拉取请求并进行任何调整。 验证更改是否有效后，可以像处理任何其他拉取请求一样进行合并。

动手练习

尝试“将 MCP 与 GitHub Copilot 集成”技能练习，以获取将 MCP 与 GitHub Copilot 进行集成的实践经验。

其他阅读材料