Einrichtung in VS Code mit Copilot

Bevor Sie die Konfiguration durchführen, wählen Sie eine Distribution (Docker oder npm) und richten Sie die Authentifizierung ein (API-Schlüssel oder OAuth 2.0). Fügen Sie dann die entsprechende Konfiguration unten hinzu.

Die Konfiguration kann entweder projektbezogen oder benutzerbezogen (über alle Projekte hinweg) verwendet werden. Für eine projektbezogene Konfiguration erstellen Sie eine .vscode/mcp.json Datei in Ihrem Arbeitsbereich. Für eine benutzerbezogene Konfiguration fügen Sie einen MCP-Server zu Ihrer bestehenden Benutzerkonfigurationsdatei hinzu. Weitere Informationen finden Sie unter VS Code MCP-Dokumentation.

Docker

API-Schlüssel

{
  "inputs": [
    {
      "type": "promptString",
      "id": "axe-api-key",
      "description": "axe MCP Server API Key",
      "password": true
    }
  ],
  "servers": {
    "axe-mcp-server": {
      "command": "docker",
      "args": [
        "run",
        "--add-host=host.docker.internal:host-gateway",
        "-i",
        "--rm",
        "-e",
        "AXE_SERVER_URL",
        "-e",
        "AXE_API_KEY",
        "dequesystems/axe-mcp-server:latest"
      ],
      "env": {
        "AXE_API_KEY": "${input:axe-api-key}"
      }
    }
  }
}

Die Konfiguration nutzt "AXE_API_KEY": "${input:axe-api-key}" für die sichere Eingabeverarbeitung. Beim ersten Start des Servers werden Sie nach Ihrem API-Schlüssel gefragt.

"env": {
  "AXE_API_KEY": "${input:axe-api-key}",
  "AXE_SERVER_URL": "https://your-axe-instance.example.com"
}

OAuth 2.0

Bevor Sie die Konfiguration vornehmen, führen Sie Schritt 1: Authentifizieren im Authentifizierungsleitfaden durch.

Dies verwendet @deque/axe-auth token , um bei jedem Serverstart ein neues Zugriffstoken zu erhalten. Kein inputs Block ist erforderlich — das Token wird automatisch aus dem System-Schlüsselbund abgerufen.

{
  "servers": {
    "axe-mcp-server": {
      "command": "sh",
      "args": [
        "-c",
        "docker run --add-host=host.docker.internal:host-gateway -i --rm -e \"AXE_ACCESS_TOKEN=$(npx -y @deque/axe-auth token)\" dequesystems/axe-mcp-server:latest"
      ]
    }
  }
}

"args": [
  "-c",
  "docker run --add-host=host.docker.internal:host-gateway -i --rm -e AXE_SERVER_URL -e \"AXE_ACCESS_TOKEN=$(npx -y @deque/axe-auth token)\" dequesystems/axe-mcp-server:latest"
],
"env": {
  "AXE_SERVER_URL": "https://your-axe-instance.example.com"
}

npm

Die npm-Verteilung läuft auf Node.js. Verwenden Sie eine aktive LTS-Version von Node.js – ältere Versionen werden möglicherweise nicht unterstützt.

Die npm-Distribution benötigt einen Chromium-Browser - entweder über Playwright installieren oder auf eine vorhandene Binärdatei verweisen. Siehe Auswahl einer Distribution.

API-Schlüssel

Erstellen Sie eine .vscode/mcp.json Datei in Ihrem Arbeitsbereich (projektbezogen) oder fügen Sie den Server zu Ihrer Benutzerkonfiguration hinzu:

{
  "servers": {
    "axe-mcp-server": {
      "command": "npx",
      "args": ["-y", "axe-mcp-server"],
      "env": {
        "AXE_API_KEY": "your-api-key-here"
      }
    }
  }
}

OAuth 2.0

OAuth 2.0 wird auch mit der npm-Distribution unterstützt — setzen Sie AXE_ACCESS_TOKEN anstelle von AXE_API_KEY, indem Sie ein neues Token von @deque/axe-auth token beim Start einfügen. Siehe Authentifizierung für den vollständigen Ablauf.

Umgang mit Geheimnissen sicher

Wenn Sie eine Anmeldeinformation im env Block einfügen, behandeln Sie diese Datei wie jedes andere Geheimnis:

• Nie ins Versionierungssystem einchecken. Projektbezogene Dateien wie .vscode/mcp.json befinden sich in Ihrem Repository — fügen Sie sie zu Ihrem .gitignorehinzu, oder halten Sie Anmeldeinformationen stattdessen in Ihrer Benutzerkonfiguration.
• Bevorzugen Sie Ihre Betriebssystem-Schlüsselbund oder einen Geheimverwaltung falls unterstützt. Für OAuth, @deque/axe-auth speichert bereits Tokens in Ihrem System-Schlüsselbund — siehe Authentifizierung.
• Dateiberechtigungen einschränken , sodass nur Ihr Benutzer die Datei lesen kann (zum Beispiel, chmod 600 .vscode/mcp.json auf macOS und Linux).

MCP-Server starten

1. Öffnen Sie VS Code mit Ihren konfigurierten Einstellungen
2. Suchen Sie den "axe-mcp-server" -Eintrag in Ihrer mcp.json -Datei
3. Klicken Sie auf die **Start** -Taste, die oberhalb der Serverkonfiguration erscheint
4. Wenn Sie die Authentifizierung mit API-Schlüssel konfiguriert haben, geben Sie Ihren API-Schlüssel ein, wenn Sie dazu aufgefordert werden. Wenn Sie OAuth konfiguriert haben, startet der Server ohne Aufforderung und ruft ein Token aus Ihrem Systemschlüsselbund ab.

Eingaben an Copilot senden

Sobald der axe MCP-Server läuft, können Sie ihn über die Copilot-Chat-Oberfläche von VS Code nutzen:

1. Öffnen Sie den Copilot-Chat in VS Code
2. Stellen Sie sicher, dass Sie sich im Agentenmodus befinden, um die Nutzung von Werkzeugen zu ermöglichen
3. Senden Sie Eingaben, um Websites zu analysieren und Barrierefreiheitsprobleme zu beheben

Für empfohlene benutzerdefinierte Anweisungen, die Copilot durch den Analyse-dann-Beheben-Workflow führen, siehe Konfiguration Ihres KI-Agenten.