Integrieren von Bright Data Web MCP mit Kilo Code in VS Code

In diesem Tutorial werden Sie lernen:

Was Kilo Code ist und warum es ein leistungsstarker KI-Codierassistent für VS Code ist.
Warum die Integration von Webdatenfunktionen (über Bright Data’s Web MCP) Kilo Code noch nützlicher machen kann.
Wie Sie Kilo Code mit Bright Data’s Web MCP verbinden – Schritt für Schritt – um einen erweiterten KI-Codierungsagenten mit Live-Web-Zugriff zu erstellen.

Tauchen Sie ein!

Voraussetzungen

Um mitzumachen, benötigen Sie:

Visual Studio Code ist auf Ihrem Computer installiert (neueste Version empfohlen).
Node.js und npm sind installiert (das Bright Data Web MCP wird als npm-Paket vertrieben).
Ein Bright Data-Konto und einen API-Schlüssel.
Ein API-Schlüssel für einen LLM-Anbieter. Kilo Code unterstützt viele Anbieter (OpenAI, Anthropic, usw.)
(Optional) Python ist auf Ihrem Computer installiert. Dies ist nur erforderlich, wenn Sie das Python-Beispielskript ausführen möchten, das Kilo Code während des Tests generiert.

Machen Sie sich keine Sorgen, wenn Sie noch keinen Bright Data-API-Schlüssel haben, wir werden die Erstellung eines solchen Schlüssels erläutern. Doch zuvor wollen wir uns ansehen, was Kilo Code genau ist.

Was ist Kilo Code (und VS Code mit Kilo Code)?

Kilo Code ist ein quelloffener KI-Codierassistent, der als VS Code-Erweiterung fungiert und die besten Funktionen von beliebten Tools wie Cline und Roo Code kombiniert und gleichzeitig einzigartige Verbesserungen hinzufügt.

Er agiert wie ein ganzes KI-Entwicklungsteam in Ihrem Editor und unterstützt Sie bei der Codegenerierung, dem Refactoring, dem Debugging und sogar bei der Aufgabenautomatisierung mit natürlicher Sprache. Im Wesentlichen kann es:

Als KI-Programmiererpaar fungieren, mit dem Sie in einfachem Englisch chatten können, um Code zu planen oder zu schreiben.
Ihre Projektdateien lesen, Änderungen vornehmen und bei Bedarf sogar neue Dateien erstellen oder Terminalbefehle ausführen.
Passen Sie die “Persönlichkeit” der KI durch verschiedene Modi an – zum Beispiel durch die Modi “Architekt”, ” Programmierer” und ” Debugger”, die jeweils das Verhalten der KI bei der Planung, Programmierung oder Fehlerbehebung steuern.
Integration mit verschiedenen KI-Modellanbietern (OpenAI, Anthropic, OpenRouter, lokale LLMs wie Ollama usw.), so dass Sie das zugrunde liegende Modell auswählen können.
Verbindung zu externen Tools über das Model Context Protocol (MCP), mit dem Kilo Code Web-APIs und benutzerdefinierte Dienste für erweiterte Funktionen nutzen kann.

Kilo Code baut auf der Grundlage anderer Open-Source-Projekte auf (es hat sich aus den Agenten Roo Code und Cline entwickelt), hat aber bisher erfolgreich seinen eigenen Weg eingeschlagen. Es unterstützt über 400 KI-Modelle, darunter Gemini 2.5 Pro, Claude 4 Sonnet & Opus und GPT-5, und ermöglicht gleichzeitig Verbindungen zu externen APIs und Datenquellen, was es zur perfekten Plattform für die Webdatenintegration macht.

Warum die Integration von Web MCP in Kilo Code?

Wie alle KI-Codierassistenten hat auch das große Sprachmodell (LLM) hinter Kilo Code ein Problem mit veraltetem Wissen.

LLMs können nur Antworten generieren, die auf den statischen Trainingsdaten basieren, auf denen sie trainiert wurden, was im Wesentlichen eine Momentaufnahme der Vergangenheit ist. Das bedeutet, dass die KI möglicherweise aktuelle Frameworks übersieht, veraltete Funktionen vorschlägt oder Code erzeugt, der nicht den neuesten Best Practices entspricht.

Stellen Sie sich nun vor, dass Ihr Kilo Code-Agent in der Lage ist, aktuelle Tutorials, Dokumentationen und Beispiele aus dem Internet abzurufen und daraus in Echtzeit zu lernen. Durch die Integration von Websuche und Live-Datenextraktion könnte Kilo Code Probleme mit aktuellen Informationen lösen. So können beispielsweise die Dokumentationen einer neu veröffentlichten Bibliothek oder die neuesten Stack Overflow-Antworten auf eine Fehlermeldung abgerufen werden.

Genau das ermöglicht der Web MCP-Server von Bright Data.

Der Web MCP-Server von Bright Data ist eine leistungsstarke Model Context Protocol-Implementierung, die eine All-in-One-Lösung für den öffentlichen Webzugriff bietet, jetzt mit einer kostenlosen Stufe von 5.000 monatlichen Anfragen.

Mit anderen Worten, es handelt sich um eine Art “Webbrowser + Data Scraper”, den die KI von Kilo Code programmatisch steuern kann. Der MCP-Server stellt Tools zur Verfügung, um das Internet zu durchsuchen, auf Websites zu navigieren und strukturierte Daten zu extrahieren – alles über eine einfache API, die der KI-Agent aufrufen kann. Einige der am häufigsten verwendeten MCP-Tools sind:

search_engine: Wird verwendet, um Live-Suchen im Internet (Google, Bing oder Yandex) durchzuführen und die Suchergebnisse (Titel, Snippets, URLs) im JSON/Markdown-Format zu erhalten. So kann die KI relevante Webseiten oder Antworten in Echtzeit finden. Für alle Anwendungsfälle erfahren Sie hier, wie Sie die besten SERP-API-Tools auswählen.
scrape_as_markdown: Wird verwendet, um den Inhalt einer beliebigen Webseite abzurufen, mit Optionen zur Umgehung von Bots und CAPTCHAs, und gibt den Text im sauberen Markdown-Format zurück. Auf diese Weise kann die KI einen Artikel oder eine Dokumentationsseite lesen und diese Informationen zur Erfüllung Ihrer Aufgabe verwenden.

Durch die Verbindung von Kilo Code mit dem MCP von Bright Data erhält Ihr KI-Programmierer Augen und Hände im Web. Er kann im Rahmen seines Arbeitsablaufs suchen, klicken und scrapen, wodurch er wesentlich einfallsreicher und genauer wird. Im Folgenden erfahren Sie, wie Sie diese Integration einrichten.

So verbinden Sie Kilo Code mit Bright Data’s Web MCP in Visual Studio Code

Schritt 1: Installieren Sie Kilo Code in VS Code

Die Installation von Kilo Code erfolgt ganz einfach über den VS Code Extensions-Marktplatz. Beginnen Sie mit dem Öffnen von Visual Studio Code und dem Zugriff auf das Erweiterungsbedienfeld. Nach Abschluss der Installation werden Sie möglicherweise aufgefordert, VS Code neu zu laden, um die Erweiterung zu aktivieren. Achten Sie auf das Kilo Code-Symbol, das nun in Ihrer VS Code-Seitenleiste erscheint, normalerweise auf der linken Seite der Benutzeroberfläche.

Schritt #2: Konfigurieren Sie Ihren LLM-Anbieter

Wenn Kilo Code installiert ist, klicken Sie auf das Kilo Code-Symbol in Ihrer Seitenleiste, um das Hauptfenster zu öffnen. Die Schnittstelle erscheint auf der linken Seite Ihres VS Code-Fensters und bietet Zugang zu allen Funktionen und Konfigurationsoptionen von Kilo Code.

Kilo Code bietet mehrere Wege, um auf AI-Modelle zuzugreifen, was es für Benutzer mit unterschiedlichen Vorlieben und Budgets flexibel macht.

Für neue Nutzer ist es am bequemsten, das integrierte Creditsystem zu verwenden. Klicken Sie im Kilo Code-Bedienfeld auf “Mit Google verbinden”, um Ihr Konto zu authentifizieren. Durch diesen Vorgang wird Ihrem Konto automatisch ein kostenloses Guthaben in Höhe von 20 US-Dollar gutgeschrieben, mit dem Sie sofortigen Zugriff auf über 400 KI-Modelle haben, ohne dass Sie separate API-Schlüssel benötigen.
Wenn Sie lieber Ihre eigenen API-Schlüssel verwenden möchten, klicken Sie auf das Zahnradsymbol in der Kilo Code-Seitenleiste und navigieren Sie zum Abschnitt Modellanbieter. Hier können Sie API-Schlüssel für verschiedene Anbieter hinzufügen, darunter Anthropic (für Claude-Modelle), OpenAI (für GPT-Modelle), Google (für Gemini-Modelle) oder jeden anderen OpenRouter-kompatiblen Dienst.

Sobald Ihr Modellanbieter konfiguriert ist, nehmen Sie sich einen Moment Zeit, um Ihr bevorzugtes Modell aus den verfügbaren Optionen auszuwählen. Sie könnten GPT-4 für komplexe Schlussfolgerungen, Claude-3 für detaillierte Code-Analysen oder Gemini für multimodale Fähigkeiten wählen.

Um zu überprüfen, ob alles richtig funktioniert, senden Sie eine einfache Testnachricht wie “Hallo, kannst du mir beim Coden helfen? Die KI sollte umgehend antworten und bestätigen, dass Ihre Modellverbindung ordnungsgemäß funktioniert.

Schritt Nr. 3: Installieren Sie Bright Data’s Web MCP

Jetzt, wo Kilo Code mit einem KI-Modell eingerichtet ist, können Sie seine Fähigkeiten mit Webbrowsing und Datenextraktion erweitern.

Bevor Sie den MCP-Server installieren, müssen Sie Ihr Bright Data-API-Token erhalten. Navigieren Sie zu brightdata.com und melden Sie sich für ein kostenloses Konto an, das in den ersten drei Monaten ein großzügiges Kontingent von 5.000 kostenlosen Anfragen pro Monat umfasst. Nachdem Sie Ihr Konto erstellt haben, verifizieren Sie Ihre E-Mail-Adresse, wenn Sie dazu aufgefordert werden.
Sobald Sie angemeldet sind, rufen Sie Ihre Kontoeinstellungen auf, um Ihr API-Token zu finden und zu kopieren. Dieses Token dient als Ihr Authentifizierungsnachweis für den MCP-Server und wird im nächsten Konfigurationsschritt benötigt. Bewahren Sie dieses Token sicher und griffbereit auf, da Sie es während des Einrichtungsvorgangs benötigen.
Öffnen Sie mit dem gesicherten API-Token Ihr Terminal oder die Eingabeaufforderung, um das Bright Data Web MCP-Paket global auf Ihrem System zu installieren. Führen Sie den Befehl aus:

npm install -g @brightdata/mcp

Diese globale Installation stellt sicher, dass der MCP-Server systemweit verfügbar ist und von Kilo Code unabhängig von Ihrem aktuellen Projektverzeichnis aufgerufen werden kann.

Um zu überprüfen, ob die Installation erfolgreich war, führen Sie aus:

npx @brightdata/mcp --version

Es sollte die Version 2.5.0 oder höher angezeigt werden, was bestätigt, dass die neueste Version des MCP-Servers ordnungsgemäß installiert und einsatzbereit ist.

Schritt #4: Kilo Code mit dem Web MCP verbinden

Nun folgt der entscheidende Schritt, nämlich die Verbindung von Kilo Code mit Ihrem neu installierten Bright Data Web MCP-Server. Kilo Code unterstützt sowohl STDIO- als auch SSE-Transportmethoden für MCP-Server-Verbindungen, aber wir werden die STDIO-Methode für optimale lokale Leistung und Zuverlässigkeit verwenden.

Klicken Sie im Kilo Code-Panel auf das Zahnradsymbol und navigieren Sie zum Abschnitt MCP-Server. Suchen Sie nach der Option “Edit Global MCP”, die die Konfigurationsdatei öffnet, in der Sie Ihre Serververbindungen definieren werden. Diese Datei verwendet das JSON-Format und ermöglicht es Ihnen, bei Bedarf mehrere MCP-Server anzugeben.

Fügen Sie die folgende Konfiguration hinzu, um eine Verbindung mit dem Web-MCP von Bright Data herzustellen:

{
  "mcpServers": {
    "Bright Data Web": {
      "command": "npx",
      "args": ["@brightdata/mcp"],
      "env": {
        "API_TOKEN": "YOUR_BRIGHT_DATA_API_TOKEN_HERE"
      },
      "disabled": false,
      "alwaysAllow": ["search_engine", "scrape_as_markdown"],
      "timeout": 180
    }
  }
}

Ersetzen Sie "YOUR_BRIGHT_DATA_API_TOKEN_HERE" durch das tatsächliche API-Token, das Sie aus Ihrem Bright Data-Konto kopiert haben. Das Array alwaysAllow" lässt die grundlegenden Such- und Scraping-Tools vorab zu, um die Reibung bei normaler Verwendung zu verringern, während die Timeout-Einstellung von 180 Sekunden vorzeitige Timeouts bei langsameren Web-Scraping-Vorgängen verhindert.

Für Benutzer, die mehr Kontrolle über das Verhalten ihres MCP-Servers benötigen, bietet Bright Data mehrere erweiterte Konfigurationsoptionen. Diese erweiterte Konfiguration bietet zusätzliche Flexibilität für Unternehmensanwender oder Anwender mit speziellen Anforderungen:

{
  "mcpServer": {
    "Bright Data Web": {
      "command": "npx",
      "args": ["@brightdata/mcp"],
      "env": {
        "API_TOKEN": "IHR_BRIGHT_DATA_API_TOKEN_HIER",
        "RATE_LIMIT": "100/1h",
        "PRO_MODE": "false",
        "WEB_UNLOCKER_ZONE": "optional_custom_zone",
        "BROWSER_ZONE": "optional_custom_browser_zone"
      },
      "deaktiviert": false,
      "timeout": 180
    }
  }
}

Mit der Funktion zur Ratenbegrenzung können Sie die Häufigkeit von Anfragen mit Formaten wie "100/1h" für 100 Anfragen pro Stunde, "50/30m" für 50 Anfragen pro 30 Minuten oder "10/5s" für 10 Anfragen pro 5 Sekunden steuern. Wenn Sie PRO_MODE auf "true" setzen, erhalten Sie Zugang zu allen 60 fortgeschrittenen Werkzeugen, auch wenn dafür zusätzliche Gebühren anfallen können. Die Zonenkonfigurationen sind optional und vor allem für Unternehmenskunden mit individuellen Proxy-Anforderungen nützlich.

Um die Sicherheit zu erhöhen und die Verwaltung zu vereinfachen, sollten Sie Umgebungsvariablen verwenden, um Ihr API-Token zu speichern, anstatt es fest in der Konfigurationsdatei zu kodieren. Erstellen Sie eine .env-Datei in Ihrem Projektstamm, die Folgendes enthält:

API_TOKEN=Ihr_echtes_api_token_hier
RATE_LIMIT=100/1h
PRO_MODE=false

Verweisen Sie dann in Ihrer MCP-Konfiguration auf diese Variablen mit dem Format ${VARIABLE_NAME}. Auf diese Weise bleiben sensible Anmeldeinformationen aus Ihren Konfigurationsdateien herausgehalten und die Verwaltung verschiedener Token in Entwicklungs-, Staging- und Produktionsumgebungen wird erleichtert.

Für die Zusammenarbeit im Team oder in entfernten Entwicklungsumgebungen, in denen die Installation eines lokalen MCP-Servers schwierig sein könnte, bietet Bright Data auch eine SSE-Remote-Transportoption an:

{
  "mcpServer": {
    "Bright Data Remote": {
      "Befehl": "npx",
      "args": [
        "mcp-remote",
        "https://mcp.brightdata.com/mcp?token=YOUR_API_TOKEN_HERE"
      ],
      "deaktiviert": falsch,
      "timeout": 300
    }
  }
}

Diese Konfiguration stellt eine direkte Verbindung zum gehosteten MCP-Endpunkt von Bright Data her, sodass keine lokale Serverinstallation erforderlich ist, aber die gleiche Funktionalität zur Verfügung steht.

Die Standardkonfiguration verwendet die kostenlose Stufe von Bright Data, die den Zugriff auf grundlegende Tools wie search_engine und scrape_as_markdown umfasst. Diese Tools reichen für die meisten Anforderungen an die Webdatenintegration aus und bieten im Rahmen der 5.000 monatlichen Anfragen einen hervorragenden Wert.

Wenn Sie den PRO_MODE aktivieren, erhalten Sie Zugriff auf alle 60 spezialisierten Tools, einschließlich fortgeschrittener Browser-Automatisierung und strukturierter Datenextraktionsfunktionen, wobei jedoch über die Grenzen der kostenlosen Stufe hinaus zusätzliche Gebühren anfallen können.

Sobald Sie Ihre Konfigurationsdatei mit Strg+S oder Cmd+S gespeichert haben, starten Sie VS Code vollständig neu, um sicherzustellen, dass der neue MCP-Server ordnungsgemäß geladen wird. Überprüfen Sie nach dem Neustart das Kilo Code MCP-Einstellungsfeld. Dort sollte “Bright Data Web” mit dem Status “Running” aufgeführt sein, was eine erfolgreiche Verbindung anzeigt.

Schritt Nr. 5: Testen Sie den erweiterten Kilo Code Agent

Nachdem die Integration von Kilo Code und Bright Data Web MCP abgeschlossen ist, können Sie nun überprüfen, ob alles korrekt funktioniert.

Öffnen Sie das Kilo Code-Bedienfeld und vergewissern Sie sich, dass die MCP-Serververbindung aktiv ist. Achten Sie auf Verbindungsanzeigen oder Statusmeldungen, die bestätigen, dass der Bright Data Web-Server ordnungsgemäß ausgeführt wird.

Versuchen Sie für einen erweiterten Test der Scraping-Funktionalität die folgende Anfrage: “Rufen Sie den aktuellen Bitcoin-Kurs von CoinGecko ab” und erstellen Sie eine Kurzanleitung für die Anforderungsbibliothek. Mit diesem Test wird das Tool scrape_as_markdown eingesetzt und die Leistungsfähigkeit des Echtzeitzugriffs auf die Dokumentation demonstriert.

Sie sollten eine Genehmigungsaufforderung für die Scraping-Funktion sehen, gefolgt von der Extraktion von Inhalten aus der CoinGecko-Website und schließlich eine generierte Kurzanleitung mit aktuellen Beispielen und Funktionssignaturen.

Erweiterte Anwendungsfälle und Beispiele

Die Integration ermöglicht dynamische Problemlösungen, indem Ihr KI-Assistent aktuelle Lösungen von Stack Overflow, Live-API-Dokumentation und aktuellen GitHub-Diskussionen abrufen kann. Sie können diese Kombination aus Kilo Code und Bright Data unter anderem für folgende Zwecke nutzen:

Dynamische Integration der API-Dokumentation
Live-Marktdatenanalyse
Automatisierung von Wettbewerbsanalysen

Unternehmensteams können Business Intelligence durch leistungsstarke Datenintegration automatisieren. Finanzdienstleister können Echtzeit-Marktdaten mit Anfragen wie “Verfolgen Sie die Preise von Kryptowährungen an den wichtigsten Börsen und erstellen Sie ein Handels-Dashboard” überwachen . Marketingteams können Wettbewerbsanalysen automatisieren, indem sie die Preisseiten der Mitbewerber überwachen und bei Änderungen Alarm schlagen”.

Diese Anwendungen verwandeln routinemäßige Geschäftsaufgaben in automatisierte, KI-gesteuerte Prozesse, die verwertbare Erkenntnisse liefern.

Fehlersuche und Tipps

Selbst bei einer gut dokumentierten Einrichtung kann es zu kleinen Problemen kommen, wenn Sie Kilo Code zum ersten Mal mit dem Web MCP von Bright Data verbinden. Die gute Nachricht ist, dass die meisten Probleme einfach zu diagnostizieren und zu beheben sind, wenn Sie wissen, worauf Sie achten müssen.

Häufige Probleme bei der Installation

Wenn das Kilo Code-Bedienfeld nach der Installation nicht angezeigt wird, sollten Sie zunächst versuchen, Visual Studio Code neu zu starten. Vergewissern Sie sich, dass Sie die neueste Version von VS Code verwenden, da veraltete Versionen manchmal das korrekte Laden von Erweiterungen blockieren können.
Ein weiterer häufiger Stolperstein ist die API-Konfiguration. Wenn Sie Ihren LLM-Provider-Schlüssel falsch einfügen oder ein Modell auswählen, auf das Sie keinen Zugriff haben, kann Kilo Code unbemerkt fehlschlagen. Überprüfen Sie immer Ihren API-Schlüssel und führen Sie eine kurze Testabfrage wie “Hello” durch, um zu überprüfen, ob das Modell antwortet.
Auf der MCP-Seite treten die häufigsten Probleme mit der MCP-Server-Konnektivität und -Authentifizierung auf. Wenn Ihr Server den Status “Failed” anzeigt, überprüfen Sie, ob Node.js 18+ mit node --version installiert ist, und installieren Sie dann den MCP-Server neu mit:

npm uninstall -g @brightdata/mcp && npm install -g @brightdata/mcp

Authentifizierungsfehler sind in der Regel auf falsche API-Tokens zurückzuführen. Stellen Sie sicher, dass beim Kopieren keine zusätzlichen Leerzeichen verwendet werden und dass Ihr Bright Data-Konto über eine verfügbare Quote verfügt.

Windows-Benutzer benötigen möglicherweise eine alternative Konfiguration: Ersetzen Sie den Befehl durch "cmd" und args durch ["/c", "npx", "-y", "@brightdata/mcp"].
Bei Timeout-Problemen auf komplexen Websites sollten Sie den Timeout auf 300 Sekunden erhöhen und die Aktivierung des Pro-Modus für JavaScript-lastige Seiten in Betracht ziehen.

Optimierung der Leistung

Sobald alles funktioniert, sollten Sie die Leistung feinabstimmen.

Denken Sie daran, dass jeder MCP-Aufruf einen Round-Trip zum Web beinhaltet, so dass Aufgaben wie das Scraping mehrerer Seiten natürlich länger dauern als die statische Codegenerierung. Damit alles zügig abläuft, sollten Sie Ihre Aufforderungen präzise formulieren. Anstatt Kilo Code aufzufordern, “im Web nach allem über Python zu suchen”, beschränken Sie es auf “im Web nach den offiziellen Python 3.12 Release Notes zu suchen”.
Sie können Ihre Einrichtung weiter optimieren, indem Sie selektive automatische Genehmigungen für gängige Werkzeuge verwenden. Zum Beispiel durch die Einstellung "alwaysAllow": ["search_engine", "scrape_as_markdown"] verringert die Reibungsverluste und gewährleistet gleichzeitig die Sicherheit.
Wählen Sie außerdem STDIO-Transport für die lokale Entwicklung (schneller) und SSE-Transport für entfernte Umgebungen (zuverlässiger).
Behalten Sie die Ressourcennutzung im Auge. Die lokale Ausführung des MCP bedeutet, dass Ihr Rechner die Hauptarbeit leistet. Wenn Sie bei großen Scraping-Aufgaben eine Verlangsamung feststellen, können Sie zum gehosteten MCP-Service von Bright Data wechseln, der die Verarbeitung in die Cloud verlagert.

Und vergessen Sie nicht, sowohl die Kilo Code-Erweiterung als auch das MCP-Paket auf dem neuesten Stand zu halten – dieEntwickler veröffentlichen regelmäßig Verbesserungen und Fehlerbehebungen, die die Stabilität erheblich verbessern können.

Zusammenfassung

Durch die Verbindung von Kilo Code mit dem Web MCP von Bright Data erhält Ihr Programmierassistent Zugriff auf Live-Webdaten direkt in VS Code. Diese Einrichtung hilft Ihnen bei der Arbeit mit aktuellen Informationen für eine bessere Codierung und Problemlösung.

Bright Data bietet außerdem leistungsstarke Proxy-Services, gebrauchsfertige Datensätze und viele andere Lösungen für KI. Erkunden Sie alle Bright Data-Lösungen, um die Tools zu finden, die am besten zu Ihrem Workflow passen.

Legen Sie noch heute los und erweitern Sie Ihre Webdatenfunktionen.

Vertrieb kontaktieren Gratis testen