一、介绍

MCP(Model Context Protocol) 是 Anthropic 推出的一种开放协议,旨在标准化 AI 模型与外部工具和数据源之间的连接方式。

MCP 的核心特点:

  1. 标准化接口:提供统一的协议连接模型与工具

  2. 安全性:沙盒环境运行,控制模型对资源的访问权限

  3. 可扩展性:支持各种类型的数据源和工具

  4. 跨平台:可在不同 AI 助手间共享工具配置

MCP 的主要组件:

  • MCP 客户端:AI 助手(如 Claude)

  • MCP 服务器:提供特定功能的服务端

  • 资源(Resources):数据源(文件、数据库等)

  • 工具(Tools):可执行的操作

二、使用

通过 VSCode 使用文件 MCP 和 Copilot 查看文件内容的使用过程

环境准备

  1. 安装必要扩展

    • GitHub Copilot

    • Claude for VSCode(如果使用 Claude)

    • 或相应的 MCP 客户端扩展

  2. 配置 MCP 服务器

// settings.json
{
  "mcp.servers": {
    "filesystem": {
      "command": "npx",
      "args": ["@modelcontextprotocol/server-filesystem", "/path/to/your/workspace"]
    }
  }
}

使用流程

步骤 1:启动 MCP 文件服务器

  1. 在 VSCode 中打开命令面板 (Ctrl+Shift+P)

  2. 搜索 "MCP: Connect to server"

  3. 选择文件系统服务器

步骤 2:通过 Copilot 查询文件

基本查询示例

@workspace 请列出当前目录下的所有文件

步骤 3:查看具体文件内容

@workspace 请读取 package.json 文件并显示其内容
@workspace 查看 src/utils 目录下的所有工具函数文件

步骤 4:多文件分析

@workspace 分析当前项目结构:
1. 列出所有配置文件
2. 显示主要的源代码目录
3. 查看依赖关系

具体使用场景示例

场景 1:项目结构探索

@workspace 
请帮我:
1. 列出项目根目录的所有文件和文件夹
2. 查看 src 目录的详细结构
3. 读取主要的配置文件(package.json、tsconfig.json等)

场景 2:代码文件分析

@workspace 
请分析:
1. 查看所有的 .ts 文件
2. 读取主要的组件文件内容
3. 显示工具函数文件的导出内容

场景 3:特定文件搜索

@workspace 
搜索包含 "API" 关键字的文件,并显示这些文件的内容概要

高级功能

1. 文件过滤

@workspace 
只显示 .md 和 .json 文件,忽略 node_modules

2. 内容提取

@workspace 
从所有 .ts 文件中提取接口定义和类型声明

3. 项目分析

@workspace 
分析项目结构:
- 配置文件有哪些
- 源代码组织方式
- 入口文件是哪个
- 依赖关系如何

实际对话示例

用户

@workspace 我现在在一个新项目中,请帮我查看当前目录有什么文件,并简要介绍项目结构

Copilot

根据当前目录扫描,我发现以下文件结构:

📁 项目根目录
├── 📄 package.json        # 项目配置和依赖
├── 📄 tsconfig.json       # TypeScript 配置
├── 📁 src/               # 源代码目录
│   ├── 📄 index.ts       # 入口文件
│   ├── 📁 utils/         # 工具函数
│   └── 📁 types/         # 类型定义
├── 📁 docs/              # 文档目录
└── 📄 README.md          # 项目说明

这是一个 TypeScript 项目,采用标准的源码组织方式...

注意事项

  1. 权限控制:MCP 服务器只能访问配置的目录

  2. 文件大小限制:大文件可能无法完整读取

  3. 性能考虑:避免一次性读取过多文件

  4. 安全性:确保不暴露敏感文件路径

三、创建

在vscode创建mcp文件,并且调用copilote扩展使用

0、启动mcp服务器

进入 文件 -> 首选项 -> 设置搜索 "MCP",并在 settings.json 文件中启用 chat.mcp.discovery.enabled

1、创建配置文件

创建一个名为 MCP.json 的文件,并将其放置在 .vscode 文件夹中

.vscode
|-- mcp.json

2、配置服务器

在 mcp.json 文件中添加以下内容:

{
	"inputs":[],
	"servers": {
		"MyFirstMCP":{
			"type":"stdio",
			"command":"dotnet",
			"args":[
				"run",
				"--project",
				"MyFirstMCP.csproj文件路径"
			]
		},
		"McpCalculatorServer":{
			"type":"stdio",
			"command":"dotnet",
			"args":[
				"run",
				"--project",
				"McpCalculatorServer.csproj文件路径"
			]
		}
	}
}

以上是启动一个用 .NET 编写的服务器

下面是两个mcp的csproj和cs文件

MyFirstMCP

<Project Sdk="Microsoft.NET.Sdk">

  <PropertyGroup>
    <OutputType>Exe</OutputType>
    <TargetFramework>net10.0</TargetFramework>
    <ImplicitUsings>enable</ImplicitUsings>
    <Nullable>enable</Nullable>
  </PropertyGroup>

</Project>
// See https://aka.ms/new-console-template for more information
Console.WriteLine("Hello, World!");

McpCalculatorServer

<Project Sdk="Microsoft.NET.Sdk">

  <PropertyGroup>
    <OutputType>Exe</OutputType>
    <TargetFramework>net10.0</TargetFramework>
    <ImplicitUsings>enable</ImplicitUsings>
    <Nullable>enable</Nullable>
  </PropertyGroup>

  <ItemGroup>
    <PackageReference Include="System.CommandLine" Version="2.0.0-beta4.22272.1" />
  </ItemGroup>

</Project>
using System;
using System.CommandLine;

var rootCommand = new RootCommand("MCP Calculator Server");

// 添加命令
var addCommand = new Command("add", "Add two numbers");
var num1Option = new Option<double>("--num1", "First number") { IsRequired = true };
var num2Option = new Option<double>("--num2", "Second number") { IsRequired = true };

addCommand.AddOption(num1Option);
addCommand.AddOption(num2Option);

addCommand.SetHandler((double num1, double num2) =>
{
    var result = num1 + num2;
    Console.WriteLine($"Result: {result}");
}, num1Option, num2Option);

rootCommand.AddCommand(addCommand);

// 解析和执行命令
return await rootCommand.InvokeAsync(args);

3、启动服务器

  1. 在 mcp.json 找到 "启动" 图标:

    image

  2. 点击 "启动" 图标,然后点击该工具图标,你会看到已注册工具的列表,根据需要勾选/取消勾选每个工具,以决定是否让 GitHub Copilot 使用它们作为上下文:

    image

  3. 要运行工具,请输入一个与工具描述匹配的提示,例如 "add 22 to 1":

    image

  4. 点击允许,显示结果为 23。 

    image

Logo

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

更多推荐