Claude Codeでのセットアップ
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
Axe MCPサーバーはプロジェクトレベルまたはユーザーレベルで追加できます。
スコープを選択
- プロジェクトレベル: プロジェクトのルートディレクトリにファイルを作成します（チームと設定を共有するのに最適です）
.mcp.json. - ユーザーレベル: 以下の場所に設定ファイルを作成または編集します：
- macOS/Linux:
~/.config/claude-code/mcp.json - Windows:
%APPDATA%\claude-code\mcp.json
- macOS/Linux:
構成JSONの追加
以下の構成JSONを追加します。
info
すでに他のサーバーが定義されている場合は、 axe-mcp-server ブロックを既存の mcpServers オブジェクト内に追加します。
{
"mcpServers": {
"axe-mcp-server": {
"type": "stdio",
"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_SERVER_URL": "https://axe.deque.com",
"AXE_API_KEY": "${AXE_API_KEY}"
}
}
}
} note
この構成は "AXE_API_KEY": "${AXE_API_KEY}" を使用して安全な入力処理を行います。 ${AXE_API_KEY} 構文はClaude Codeにシェル環境から値を取得するよう指示します。詳細は Claude Code MCPドキュメンテーションを参照してください。
note
地域、プライベートクラウド、またはオンプレミスのaxeインスタンスを使用していますか？ を更新し、次の AXE_SERVER_URL 値を env ブロックでインスタンスのベースURLに設定します：
"env": {
"AXE_API_KEY": "${AXE_API_KEY}",
"AXE_SERVER_URL": "https://your-axe-instance.example.com"
}省略した場合、サーバーはデフォルトで https://axe.deque.com （Dequeの共有US SaaSインスタンス）に設定されます。詳細は 設定オプション を参照してください。
APIキーの設定
シェルの環境変数としてAPIキーを設定します：
export AXE_API_KEY="your-api-key-here"永続的な設定のために、この行をシェルプロファイル（~/.bashrc、 ~/.zshrcなど）に追加します。
使用と検証
設定後、Claude Codeを再起動してMCPサーバーをロードします。
- ターミナルからClaude Codeを起動します：
claude - 入力してMCPサーバーの接続を管理します
/mcp。 - 以下が表示されるはずです
axe-mcp-server、これらのanalyzeおよびremediateツールが利用可能です
Claude Codeの設定（推奨）
Claude Codeがaxe MCP Serverツールを正しく使用するように、次の指示を CLAUDE.md プロジェクトルートにあるファイルに追加します。これにより、Claudeは分析した後に修正するワークフローに従うよう指示されます。
# 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エージェント指示の詳細は、 AIエージェントの設定を参照してください。