So bauen Sie einen MCP (Model Context Protocol) Server: Eine Anleitung für Anfänger

Stellen Sie sich vor, Sie geben Ihrem KI-Assistenten die Möglichkeit, Wetterdaten abzurufen, Aktienkurse zu analysieren oder Aufgaben zu automatisieren – alles über ein einziges Protokoll. Das Model Context Protocol (MCP) macht dies möglich, und mit dem neuen MCP Framework ist der Aufbau eines eigenen Servers einfacher denn je.

In diesem Leitfaden führe ich Sie durch die Erstellung eines MCP-Servers mit den CLI-Tools des MCP Frameworks. Keine Vorkenntnisse in MCP erforderlich – nur grundlegende JavaScript/TypeScript-Kenntnisse und ein bisschen Neugier!

💡

Sind Sie bereit, Ihre MCP-Entwicklung auf die nächste Stufe zu heben? Laden Sie Apidog noch heute kostenlos herunter und entdecken Sie, wie es Ihren Workflow verändern kann!

button

Verständnis von MCP

Bevor wir uns mit der Einrichtung befassen, wollen wir kurz erläutern, was MCP ist und warum es wichtig ist:

MCP-Übersicht: Das Model Context Protocol ist eine offene Spezifikation, die von Anthropic erstellt wurde, um die Art und Weise zu standardisieren, wie KI-Modelle mit externen Datenquellen interagieren. Es ermöglicht Entwicklern, Tools zu erstellen, die einfach in KI-Plattformen wie Claude Desktop integriert werden können.

Vorteile von MCP: MCP vereinfacht den Integrationsprozess, indem es ein standardisiertes Protokoll für die Tool-Entwicklung bereitstellt. Das bedeutet, dass Sie sich auf die Erstellung von Tools konzentrieren können, ohne sich Gedanken über Kompatibilitätsprobleme auf verschiedenen Plattformen machen zu müssen.

Erstellen Ihres ersten MCP-Servers

Schritt 1: Was Sie benötigen

Vergewissern Sie sich vor dem Start, dass Sie Folgendes installiert haben:

Node.js (20 oder höher): Der Server basiert auf Node.js, daher benötigen Sie es installiert. Hier herunterladen
TypeScript (5.0 oder höher): Dies wird für den Aufbau Ihres Servers verwendet.
npm: Ein Paketmanager zur Handhabung von Abhängigkeiten.
MCP Framework: Dies kann global über npm installiert oder einem bestehenden Projekt hinzugefügt werden.
10 Minuten Geduld: Im Ernst, es geht so schnell

Schritt 2: Installieren Sie das MCP Framework

Es gibt zwei Möglichkeiten, mit dem MCP Framework zu beginnen:

Option 1: Verwendung der MCP CLI (empfohlen)

Der einfachste Weg, einen MCP-Server einzurichten, ist die Verwendung der CLI. So geht's:

# Install the CLI globally  
npm install -g mcp-framework  

# Create a new project  
mcp create my-mcp-server  

# Navigate to your project  
cd my-mcp-server  

# Install dependencies  
npm install

Dies erstellt einen sofort einsatzbereiten MCP-Server mit: Vorkonfiguriertem TypeScript, Beispiel-Tools und integrierter Fehlerbehandlung. Es sollte in etwa so aussehen:

Jetzt ist Ihr neues MCP-Projekt einsatzbereit.

Option 2: Manuelle Installation (für bestehende Projekte)

Wenn Sie das MCP Framework zu einem bestehenden Projekt hinzufügen möchten, gehen Sie wie folgt vor:

Installieren Sie das MCP Framework:

npm install mcp-framewor

Erstellen Sie einen einfachen Server in der Datei src/index.ts:

import { MCPServer } from "mcp-framework";  

const server = new MCPServer();  

server.start().catch((error) => {  
  console.error("Server error:", error);  
  process.exit(1);  
});

Schritt 3: Erstellen Ihres ersten Tools (Wetterbeispiel)

Nachdem Ihr Server eingerichtet ist, erstellen wir ein Wetter-Tool, das Wetterinformationen für eine bestimmte Stadt abruft.

Erstellen Sie ein neues Tool:

Mit der MCP CLI können Sie ein neues Tool für Wetterinformationen erstellen:

mcp add tool weather

Dadurch wird eine Datei namens src/tools/WeatherTool.ts generiert. Alternativ können Sie diese Datei auch einfach manuell selbst erstellen. Bearbeiten wir nun diese Datei.

Ändern Sie das Wetter-Tool:

Öffnen Sie die Datei WeatherTool.ts und aktualisieren Sie sie wie folgt:

import { MCPTool } from "mcp-framework";  
import { z } from "zod";  

interface WeatherInput {  
  city: string;  
}  

class WeatherTool extends MCPTool<WeatherInput> {  
  name = "weather";  
  description = "Get weather information for a city";  

  // Schema validation using Zod  
  schema = {  
    city: {  
      type: z.string(),  
      description: "City name (e.g., London)",  
    },  
  };  

  async execute({ city }: WeatherInput) {  
    // Replace this with a real API call  
    return {  
      city,  
      temperature: 22,  
      condition: "Sunny",  
      humidity: 45,  
    };  
  }  
}  

export default WeatherTool;

In diesem Code definieren wir eine WeatherTool-Klasse, die das Wetter für eine Stadt abruft. Während diese Mock-Implementierung statische Daten zurückgibt, können Sie sie durch einen echten API-Aufruf ersetzen.

Schritt 4: Erstellen und Testen Ihres MCP-Servers

Nachdem Sie das Wetter-Tool geändert haben, ist es an der Zeit, es zu erstellen und zu testen, um zu sehen, ob Ihr MCP-Server wie erwartet funktioniert, und dafür verwenden wir den MCP-Inspector.

Erstellen Sie das Projekt:

npm run build

Wählen Sie eine Transportmethode: MCP Framework unterstützt zwei Transporte:

STDIO Transport: Am besten für CLI- und lokale Integrationen.
SSE Transport: Ideal für Webanwendungen und verteilte Systeme.

Für dieses Tutorial verwenden wir den STDIO Transport, der sich perfekt für lokale Tests eignet.

Starten Sie den MCP Inspector: Verwenden Sie den folgenden Befehl:

npx @modelcontextprotocol/inspector dist/index.js

Testen Sie das Wetter-Tool:

Um Ihr Wetter-Tool zu testen, wählen Sie das Tool weather aus und geben Sie eine Stadt wie "Paris" ein.

Sehen Sie sich dann die Mock-Wetterdaten an.

Schritt 5: Verbinden Sie das MCP mit realen Wetterdaten

Lassen Sie uns unser Wetter-Tool so aufrüsten, dass es die kostenlose API von Open-Meteo verwendet – eine leistungsstarke Alternative, die hyperlokale Vorhersagen ohne API-Schlüssel liefert. Um zu beginnen, können Sie ein neues Tool erstellen und ihm einen neuen Namen geben oder einfach den alten Tool-Code durch den neuen Code unten ersetzen:

import { MCPTool } from "mcp-framework";
import { z } from "zod";
import axios, { AxiosError } from "axios";

interface WeatherApiInput {
  city: string;
}

interface WeatherApiResponse {
  city: string;
  temperature: number;
  condition: string;
  humidity: number;
  windSpeed: number;
  feelsLike: number;
  precipitation: number;
}

class WeatherApiTool extends MCPTool<WeatherApiInput> {
  name = "weather_api";
  description = "Get real weather information for a city using Open-Meteo API";

  private readonly GEOCODING_URL = "https://geocoding-api.open-meteo.com/v1/search";
  private readonly WEATHER_URL = "https://api.open-meteo.com/v1/forecast";

  schema = {
    city: {
      type: z.string(),
      description: "City name to get weather for",
    },
  };

  async execute({ city }: WeatherApiInput): Promise<WeatherApiResponse> {
    try {
      // First, get coordinates for the city
      const geoResponse = await axios.get(this.GEOCODING_URL, {
        params: {
          name: city,
          count: 1,
          language: "en",
          format: "json"
        }
      });

      if (!geoResponse.data.results?.length) {
        throw new Error(`City '${city}' not found`);
      }

      const location = geoResponse.data.results[0];
      
      // Then get weather data using coordinates
      const weatherResponse = await axios.get(this.WEATHER_URL, {
        params: {
          latitude: location.latitude,
          longitude: location.longitude,
          current: ["temperature_2m", "relative_humidity_2m", "apparent_temperature", "precipitation", "weather_code", "wind_speed_10m"],
          timezone: "auto"
        }
      });

      const current = weatherResponse.data.current;
      
      // Map weather code to condition
      const condition = this.getWeatherCondition(current.weather_code);

      return {
        city: location.name,
        temperature: Math.round(current.temperature_2m),
        condition,
        humidity: Math.round(current.relative_humidity_2m),
        windSpeed: Math.round(current.wind_speed_10m),
        feelsLike: Math.round(current.apparent_temperature),
        precipitation: current.precipitation
      };
    } catch (error: unknown) {
      if (error instanceof Error) {
        throw new Error(`Failed to fetch weather data: ${error.message}`);
      }
      throw new Error('Failed to fetch weather data: Unknown error occurred');
    }
  }

  private getWeatherCondition(code: number): string {
    // WMO Weather interpretation codes (https://open-meteo.com/en/docs)
    const conditions: Record<number, string> = {
      0: "Clear sky",
      1: "Mainly clear",
      2: "Partly cloudy",
      3: "Overcast",
      45: "Foggy",
      48: "Depositing rime fog",
      51: "Light drizzle",
      53: "Moderate drizzle",
      55: "Dense drizzle",
      61: "Slight rain",
      63: "Moderate rain",
      65: "Heavy rain",
      71: "Slight snow",
      73: "Moderate snow",
      75: "Heavy snow",
      77: "Snow grains",
      80: "Slight rain showers",
      81: "Moderate rain showers",
      82: "Violent rain showers",
      85: "Slight snow showers",
      86: "Heavy snow showers",
      95: "Thunderstorm",
      96: "Thunderstorm with slight hail",
      99: "Thunderstorm with heavy hail"
    };
    
    return conditions[code] || "Unknown";
  }
}

export default WeatherApiTool;

Der Code ist etwas lang, aber konzentrieren Sie sich vorerst darauf, den Code zum Laufen zu bringen und das Gefühl zu bekommen, mit MCP zu beginnen. Nehmen Sie sich Zeit und verwenden Sie dies als Beispiel, um in die Erstellung noch komplexerer MCPs überzugehen.

Um das Tool zu testen, wählen Sie es einfach aus:

Geben Sie eine Stadt ein, z. B. "Lusaka", und sehen Sie sich die Ergebnisse an:

Hoffentlich haben Sie in diesem Stadium die meisten Konfigurations- und Ausführungsprobleme des Projekts überwunden, sodass das Testen des neuen MCP-Tools überhaupt keine Herausforderung sein sollte!

Arbeiten mit Apidog

Vergessen Sie nicht, Ihre MCP-Serverentwicklung mit Apidog zu unterstützen – einem vielseitigen Tool, das API-Tests, Mocking und Dokumentation vereinfacht. Beginnen Sie mit der Anmeldung für die kostenlose Version und erstellen Sie dann ein Projekt, um Ihre API-Workflows zu zentralisieren. Importieren Sie Ihre Endpunkte, um Anfragen zu überwachen, Antworten mit intelligenten Mock-Servern zu simulieren und Tests zu automatisieren, um versteckte Fehler frühzeitig zu erkennen. Apidog rationalisiert das Debugging und stellt sicher, dass Ihre Tools fehlerfrei funktionieren, was es zum perfekten Begleiter für den Aufbau robuster KI-Integrationen macht.

Fazit

Der Aufbau eines MCP-Servers ist ein unkomplizierter Prozess, der Ihre KI-Workflows erheblich verbessern kann. Durch die Integration von Tools wie Apidog können Sie Ihren Entwicklungsprozess rationalisieren und so robuste und gut dokumentierte APIs sicherstellen. Unabhängig davon, ob Sie mit Webdiensten oder lokalen Dateien arbeiten, bietet MCP eine standardisierte Möglichkeit, KI-Modelle mit externen Datenquellen zu verbinden.

Sind Sie bereit, Ihren API-Entwicklungs-Workflow auf die nächste Stufe zu heben? Laden Sie Apidog noch heute kostenlos herunter und entdecken Sie, wie es Ihren Workflow verändern kann!

button