axe MCP Server

This page is not available in the language you requested. You have been redirected to the English version of the page.
Link to this page copied to clipboard
Not for use with personal data

Overzicht

De axe MCP Server is een Model Context Protocol (MCP) server die toegankelijkheidstests van ondernemingskwaliteit rechtstreeks in uw ontwikkelworkflow integreert. Gebouwd op het vertrouwde axe-platform stelt het ontwikkelaars in staat om uitgebreide toegankelijkheidsscans uit te voeren en deskundige richtlijnen voor correcties te ontvangen zonder hun IDE te verlaten.

De server biedt twee primaire mogelijkheden - analyze en remediate.

Beide tools integreren naadloos met MCP-compatibele clients (zoals Claude Desktop, VS Code met Copilot of Cursor) en respecteren de axe-configuratie-instellingen van uw organisatie.

Toegang Krijgen

Axe MCP Server is inbegrepen in het Axe DevTools for Web pakket.

Tools & Mogelijkheden

De analyze Tool

De analyze tool voert uitgebreide toegankelijkheidsanalyses uit op webpagina's door een scan uit te voeren via de axe DevTools Browser Extension in een echte browseromgeving. Het werkt naadloos met zowel lokale ontwikkelings-URL's (bijv. localhost:3000) als externe productie-URL's.

Wat Het Doet

  1. API-sleutelvalidatie - Valideert de API-sleutel van de gebruiker om geautoriseerde toegang te garanderen
  2. Configuratie Ophalen - Haalt de organisatiespecifieke axe-configuratie instellingen van de gebruiker op, inclusief:
    • Toegankelijkheidsteststandaard (bijv. WCAG 2.2 AA)
    • axe-core versie
    • Behoeft beoordeling / best practices
  3. Browsergebaseerde Analyse - Start een browserinstant in de achtergrond met de axe DevTools-extensie gemonteerd
  4. Paginanavigatie - Navigeert naar de URL die door de gebruiker in hun prompt aan de AI-agent is opgegeven
  5. Toegankelijkheidsscan - Voert een volledige toegankelijkheidsanalyse uit op de gerenderde pagina met behulp van de axe DevTools Browser Extension, waardoor ervoor wordt gezorgd dat de daadwerkelijke gebruikerservaring wordt getest (niet alleen de statische HTML)
  6. Resultaatlevering - Geeft uitgebreide analyseresultaten terug aan de agent in een gestructureerd formaat

Responsief Testen

De analyze tool ondersteunt optionele viewportWidth en viewportHeight parameters, zodat u pagina's op specifieke weergaveafmetingen kunt testen. Dit is handig voor het opsporen van toegankelijkheidsproblemen die alleen bij bepaalde schermformaten verschijnen, zoals breekpunten voor mobiel of tablet.

Analyze http://localhost:3000 for accessibility issues at a mobile viewport of 375x812

Wanneer deze parameters worden weggelaten, gebruikt de browser zijn standaard weergaveafmeting.

Belangrijke Voordelen

  • Testen in Echte Browser - Test de daadwerkelijk weergegeven pagina, niet alleen de broncode, waardoor nauwkeurige resultaten worden gegarandeerd
  • Organisatiestandaarden - Respecteert de axe-configuratie-instellingen van uw team voor consistente tests bij alle gebruikers
  • Uitgebreide Dekking - Benut het toonaangevende axe Platform in de industrie
  • **Responsieve Testen** - Test op specifieke weergavebreedtes om toegankelijkheidsproblemen bij breekpunten te detecteren

Uitvoer

De tool geeft een gestructureerd JSON-antwoord dat het volgende bevat:

  • Alle gevonden toegankelijkheidsovertredingen
  • Overtredingsniveaus (kritiek, ernstig, matig, minder)
  • Specifieke elementselectors en broncode
  • Regel-ID's en beschrijvingen

De remediate Tool

De remediate tool neemt elk toegankelijkheidsprobleem dat door axe wordt geïdentificeerd en genereert contextbewuste, door AI aangestuurde hersteladviezen die codeagenten kunnen vertalen naar daadwerkelijke codeoplossingen.

Wat Het Doet

  1. **API-sleutel Validatie** - Valideert de API-sleutel van de gebruiker om geautoriseerde toegang te garanderen
  2. **AI Kredietgebruik** - Elke remediate oproep verbruikt AI-kredieten van de toewijzing van uw organisatie, waardoor het gebruik van geavanceerde AI-modellen mogelijk wordt gemaakt die zijn getraind op de uitgebreide toegankelijkheidsexpertise van Deque
  3. **AI-Gegenereerd Herstel** - Creëert een hoogwaardige, bruikbare toegankelijkheidsoplossing die codeagenten kunnen interpreteren en implementeren in de broncode
note

Als de AI-kredieten op zijn, zal de remediate tool niet meer werken totdat uw kredieten zijn aangevuld (door meer aan te schaffen of totdat uw maandelijkse cyclus opnieuw begint). Echter, de analyze tool zal blijven functioneren.

Uitvoer

De tool levert gestructureerde hersteladviezen die het volgende omvatten:

  • Samenvatting op hoog niveau van de vereiste oplossing
  • Specifieke codewijzigingen die nodig zijn (in HTML-formaat)
  • Toegankelijkheidsredenering en WCAG-criteria
  • Extra context om een juiste implementatie te garanderen

Kredietgebruik

De remediate tool maakt deel uit van het AI-Kredietbeheersysteem. Elke herstelverzoek verbruikt kredieten van de maandelijkse toewijzing van uw organisatie. Beheerders kunnen het kredietgebruik controleren via het axe Account Portal.

Installatie en Setup

Vereisten

  • Docker geïnstalleerd en werkend op uw systeem
  • AI-agent geconfigureerd voor axe MCP Server (zie Configuratie hieronder voor IDE-specifieke installatie-instructies)
  • Een abonnement dat toegang tot axe MCP Server mogelijk maakt door te overleggen met een verkoopvertegenwoordiger van Deque

Stap 1: Genereer API-sleutel

  1. Log in op het axe Account Portal
  2. Navigeer naar de API-sleutels pagina
  3. Klik op **NIEUWE API-SLEUTEL TOEVOEGEN**
  4. Selecteer **axe MCP Server** als het product
  5. Voer een beschrijvende naam in voor uw API-sleutel
  6. Klik op **Opslaan**
  7. Kopieer de gegenereerde API-sleutel voor gebruik in de volgende stap

Stap 2: Haal de Docker-image op

Aanvankelijk en elke keer wanneer er een bijgewerkte versie wordt uitgebracht die u wilt gebruiken, moet u docker pull de axe MCP Server-image ophalen:

docker pull dequesystems/axe-mcp-server:latest

Stap 3: Configuratie

Kies uw IDE voor specifieke installatie-instructies:

Voorbeeldprompten

Zorgen dat verwachte tools worden aangeroepen

In veel IDE's zorgt het gebruik van de volgende syntaxis ("#"-voorvoegsel) ervoor dat de axe MCP Server-tools worden aangeroepen zoals verwacht:

#analyze the http://localhost:3033/ web page for accessibility issues and #remediate any violations found

Analyse van een localhost-URL voor toegankelijkheidsproblemen:

Analyze http://localhost:3000 for accessibility issues

Analyse met remediëring:

Analyze https://example.com for accessibility issues and fix any issues found

Uw AI Agent configureren (Aanbevolen)

Om ervoor te zorgen dat uw AI-coderingsagent de axe MCP Server-tools correct gebruikt en de beste toegankelijkheidspraktijken volgt, kunt u hem voorzien van aangepaste instructies. Deze instructies helpen de agent om de juiste workflow te begrijpen voor het analyseren en remediëren van toegankelijkheidsproblemen.

Waar instructies te plaatsen

De methode varieert per cliënt:

  • **VS Code met GitHub Copilot** - Voeg toe aan .github/copilot-instructions.md in de hoofdmap van uw project
  • **Cursor** - Voeg toe aan "Cursor Rules" in de instellingen
  • **Claude Code** - Voeg toe aan een CLAUDE.md bestand in de hoofdmap van uw project
  • **Claude Desktop** - Voeg toe aan aangepaste instructies in de instellingen
  • **Andere MCP-klanten** - Raadpleeg de documentatie van uw cliënt voor de configuratie van aangepaste instructies

Voorbeeld werkstroominstructies

Hieronder vindt u een aanbevolen sjabloon die u kunt aanpassen voor uw agent:

# Accessibility Testing and Remediation Workflow

## MANDATORY WORKFLOW - DO NOT DEVIATE

When working with accessibility issues, you MUST follow this exact workflow:

### 1. Analysis Phase

When asked to analyze pages for accessibility issues, you MUST:

- Use the `analyze` tool to scan the page
- Do NOT manually identify accessibility issues
- Always provide the complete URL being analyzed

### 2. Remediation Phase

When asked to remediate or fix accessibility issues, you MUST:

- First use `remediate` tool for EACH violation found
- Provide the exact HTML element, rule ID, and issue description
- Review the remediation guidance before making any code changes
- Apply fixes based on the remediate tool's recommendations
- Do NOT manually fix accessibility issues without first using the remediate tool

### 3. Verification Phase

After applying fixes, you MUST:

- Re-run `analyze` to verify all issues are resolved
- Confirm zero violations before considering the task complete

## Required Workflow Example:

1. analyze → Find violations
2. For each violation: remediate → Get fix guidance
3. Apply recommended fixes to code
4. analyze → Verify fixes

## Enforcement

- NEVER skip the remediate tool when fixing accessibility issues
- ALWAYS use both analyze and remediate tools as specified
- This workflow ensures proper accessibility best practices and compliance

Waarom dit belangrijk is

Deze instructies zorgen ervoor dat uw agent:

  • **Gebruikt de expertise van Deque** - Maakt gebruik van AI-modellen die getraind zijn op decennia aan toegankelijkheidsgegevens in plaats van algemene LLM-kennis
  • **Volgt beste praktijken** - Past consistente, WCAG-conforme oplossingen toe in plaats van generieke oplossingen
  • **Verifieert wijzigingen** - Bevestigt altijd dat oplossingen de problemen daadwerkelijk hebben opgelost
  • **Vermijdt valse zekerheid** - Neemt niet zonder meer aan dat het weet hoe toegankelijkheidsproblemen moeten worden opgelost zonder deskundige begeleiding

Hoewel optioneel, verbeteren deze instructies de kwaliteit en betrouwbaarheid van toegankelijkheidsoplossingen in uw codebase aanzienlijk.

Configuratieopties

De axe MCP Server ondersteunt verschillende omgevingsvariabelen voor aanpassing:

Omgevingsvariabele Beschrijving Standaard
AXE_API_KEY De API-sleutel die moet worden gebruikt om uw toegang tot de axe MCP-server te valideren (zie Stap 1: Genereer API-sleutel hierboven).
AXE_SERVER_URL De basis-URL van het axe-accountportaal van uw organisatie. Alleen vereist als uw organisatie geen gebruik maakt van de standaard gedeelde Amerikaanse SaaS-instantie. Zie hieronder voor details. "https://axe.deque.com"
BROWSER_TIMEOUT_MS Het aantal milliseconden dat we browserinteracties toestaan voordat ze worden afgebroken 30000
LOG_LEVEL Volgt het Syslog-protocol; ondersteunde waarden zijn "debug", "info", "warn", en "error" "info"

AXE_SERVER_URL

De standaardwaarde (https://axe.deque.com) is correct voor de meeste gebruikers — degenen die op de gedeelde Amerikaanse Deque SaaS-instantie zitten. Als uw organisatie een van de volgende gebruikt, moet u AXE_SERVER_URL instellen op de basis-URL van uw instantie:

  • Een regionale SaaS-instantie (EU, Australië, Frankfurt, enz.)
  • Een privécloud- implementatie
  • Een on-premises installatie

Als u niet weet welke instantie uw organisatie gebruikt, controleer dan de URL die u gebruikt om in te loggen op het axe-accountportaal, of vraag het aan uw beheerder.

Stel AXE_SERVER_URL expliciet in het env blok van uw MCP-serverconfiguratie. De IDE-specifieke installatiehandleidingen voor VS Code met Copilot en Cursor bevatten voorbeelden die precies laten zien waar het moet worden toegevoegd.

Probleemoplossing

Veelvoorkomende problemen

Server start niet op:
  • Zorg ervoor dat Docker draait
  • Controleer of uw API-sleutel correct is
  • Controleer of u toegang heeft tot de axe MCP-server (neem contact op met support indien nodig)
Scan-timelimits:
  • Verhoog BROWSER_TIMEOUT_MS voor complexe pagina's
  • Controleer of de doel-URL toegankelijk is vanuit uw netwerk
  • Controleer op netwerkconnectiviteitsproblemen
ERR_CONNECTION_REFUSED bij het analyseren van een lokale ontwikkelserver

Als de analyze tool faalt met een net::ERR_CONNECTION_REFUSED fout bij het proberen scannen van een lokaal draaiende ontwikkelserver, dit komt waarschijnlijk omdat axe MCP Server binnen een Docker-container draait en geen toegang heeft tot diensten die alleen gebonden zijn aan localhost (d.w.z. 127.0.0.1) op uw hostmachine.

Foutenvoorbeeld:

net::ERR_CONNECTION_REFUSED at http://192.168.65.2:5173/

Oplossing: Start uw ontwikkelserver met de --host vlag ingesteld op 0.0.0.0 zodat hij op alle netwerkinterfaces luistert en bereikbaar is vanuit de Docker-container:

# Vite
npm run dev -- --host=0.0.0.0

# Webpack (webpack-dev-server)
npm run dev -- --host=0.0.0.0
Authenticatiefouten:
  • Controleer of uw API-sleutel geldig is en niet verlopen
  • Zorg ervoor dat uw abonnement op het axe Account Portal toegang tot MCP Server omvat
  • Controleer dat de API-sleutel is aangemaakt voor het product „axe MCP Server“
  • Als uw organisatie een regionale, private cloud of on-premise axe-instantie gebruikt, controleer dan dat AXE_SERVER_URL is ingesteld op de basis-URL van uw instantie — zonder dit zal de server proberen te authenticeren tegen https://axe.deque.com en falen. Zie Configuratieopties voor details.
Docker-gerelateerde problemen:
  • Zorg ervoor dat de Docker-daemon draait
  • Controleer Docker-rechten
  • Controleer netwerkconnectiviteit voor het downloaden van Docker-images
  • Zorg ervoor dat Docker voldoende geheugen heeft door een docker system prune

Hulp krijgen

Als u problemen tegenkomt die niet in dit probleemoplossingsgedeelte worden behandeld:

  1. Controleer de VS Code-ontwikkelaarsconsole voor gedetailleerde foutmeldingen
  2. Bekijk de Docker-containerlogboeken voor extra debug-informatie
  3. Neem contact op met ons ondersteuningsteam op helpdesk@deque.com met:
    • Uw VS Code-versie
    • Docker-versie
    • Volledige foutmeldingen
    • Stappen om het probleem te reproduceren

Ondersteuning

Voor vragen, problemen of feedback met betrekking tot de axe MCP Server:

Veiligheid & privacy FAQ

Slaat de axe MCP Server onze broncode op?

Nee. De axe MCP Server slaat uw broncode niet op in enige database of permanente opslag.

Wanneer de analyze tool uitvoert, bevat het antwoord de HTML-broncode van elementen met toegankelijkheidsproblemen voor context- en foutopsporingsdoeleinden. Deze gegevens:

  • Worden alleen teruggestuurd in het directe API-antwoord naar uw AI-agent
  • Worden nooit opgeslagen in door Deque beheerde databases
  • Blijven binnen uw lokale ontwikkelomgeving
  • Worden verwijderd nadat de analyse is voltooid

Hoe lang blijven MCP-testresultaten op door Deque beheerde infrastructuur?

Helemaal niet. MCP-testresultaten worden niet opgeslagen in een door Deque beheerd databank- of opslagsysteem.

De analyze tool:

  • Voert volledig uit binnen de Docker-container op uw machine
  • Stuurt resultaten direct naar uw AI-agent
  • Stuurt geen analyseresultaten naar Deque-servers

De enige uitzondering is wanneer u de remediate tool oproept, die minimale inbreukmetadata kan bevatten (zie hieronder) om AI-aangedreven hersteladviezen te genereren.

Welke gegevens worden naar Deque-servers verzonden?

Alleen bij gebruik van de remediate tool:

De volgende gegevens worden naar Deque's AI-herstellingsendpoint gestuurd om hersteladviezen te genereren:

  • Regel ID - De specifieke toegangsregel die werd overtreden
  • Element HTML - De HTML-opmaak van het of de getroffen elementen
  • Probleemmetadata - Omschrijving van de overtreding en hersteladvies van axe-core

Deze gegevens worden uitsluitend gebruikt om hersteladvies te genereren en worden niet langdurig opgeslagen in Deque-databases.

De analyze tool stuurt geen gegevens naar Deque-servers behalve validatieverzoeken voor de API-sleutel.

Welk toegangslevel heeft de AI-agent nodig om te functioneren?

De AI-agent (Claude, Copilot, Cursor, etc.) heeft toegang nodig tot:

  1. MCP Server Communicatie - De agent moet in staat zijn om de tools van de MCP-server aan te roepen via het Model Context Protocol

  2. Antwoordgegevens van tools - De agent ontvangt:

    • Gegevens over toegankelijkheidsovertredingen van analyze oproepen
    • Hersteladviezen van remediate oproepen
    • Deze gegevens zijn noodzakelijk voor de agent om problemen te begrijpen en codeherstel te genereren

  3. Uw codebasis (optioneel) - Als u wilt dat de agent automatisch codeherstel toepast, heeft het toegang nodig tot uw broncodebestanden

  • Dit is standaard voor AI-coderingsassistenten in IDE's (VS Code, Cursor, enz.)
  • Niet vereist als u de tools alleen gebruikt voor analyse en begeleiding (bijv., via Claude Desktop-app)

De MCP-server zelf heeft toegang nodig tot:

  • URL's die u opgeeft voor testen (ondersteunt zowel lokaal als op afstand)
  • Uw axe API-sleutel (gegenereerd in het axe Account Portal; verstrekt via omgevingsvariabele)

Belangrijk: De MCP-server draait lokaal in een Docker-container op uw machine. Het vereist geen uitgebreide toegang tot het bestandssysteem of verhoogde privileges buiten wat Docker vereist.

Best Practices

  • Beveiliging van API-sleutels - Bewaar je AXE_API_KEY als een omgevingsvariabele, niet in de code
  • Lokale Testen - Test lokale ontwikkelings-URL's (localhost) of staging om gevoelige pre-productiecodes geïsoleerd te houden
  • Netwerkisolatie - De MCP-server communiceert alleen met:
    • URL's die je expliciet aanvraagt om te analyseren
    • Deque-servers voor validatie en herstel van API-sleutels (wanneer opgeroepen)
    • Je lokale AI-agent via het MCP-protocol
  • Controleer voor Toepassing - Bekijk altijd AI-gegenereerde codewijzigingen voordat je ze in je codebase overneemt

Is this page helpful?

Help us improve this page

Still need help?