Claude Codeでのセットアップ
ワンコマンドでセットアップしたいですか? このaxe アクセシビリティプラグインはサーバーを登録し、分析 → 修正 → 検証のワークフローを推進するスキルとスラッシュコマンドを追加します。このページでは、サーバーを手動で設定する方法について説明します。
設定を行う前に、ディストリビューションを選択(Docker または npm)および認証を設定(API キーまたは OAuth 2.0)を準備してください。その後、以下の該当する設定を追加します。
Axe MCP サーバーは、プロジェクトレベルまたはユーザーレベルで追加できます:
- プロジェクトレベル: プロジェクトのルートディレクトリに
.mcp.jsonファイルを作成します(チームと設定を共有するのに最適) - ユーザーレベル: ホームディレクトリ内の
~/.claude.jsonにあるmcpServersオブジェクトにサーバーを追加します(全てのプロジェクトで適用されます)。ユーザーレベルのサーバーはclaude mcp add --scope userコマンドで管理することもできます。詳細はClaude Code MCPドキュメンテーションをご覧ください。
既に他のサーバーが定義されている場合は、既存のmcpServersオブジェクト内にaxe-mcp-serverブロックを追加してください。
Docker
API キー
{
"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}"
}
}
}
}この設定は、"AXE_API_KEY": "${AXE_API_KEY}"を使用して安全な入力処理を行います。${AXE_API_KEY}構文で、Claude Codeにシェル環境から値を取得するよう指示します。詳細はClaude Code MCPドキュメンテーションをご参照ください。
シェルの環境変数としてAPIキーを設定します:
export AXE_API_KEY="your-api-key-here"恒久的な設定を行うには、シェルプロファイル(~/.bashrc、~/.zshrcなど)にこの行を追加します。
地域、プライベートクラウド、またはオンプレミスのaxeインスタンスを使用していますか? インスタンスの基本URLでenvブロック内のAXE_SERVER_URL値を更新します。
"env": {
"AXE_API_KEY": "${AXE_API_KEY}",
"AXE_SERVER_URL": "https://your-axe-instance.example.com"
}省略された場合、サーバーはデフォルトでhttps://axe.deque.com(Dequeの共有US SaaSインスタンス)に設定されます。詳細は設定リファレンスをご覧ください。
OAuth 2.0
設定を行う前に、認証ガイドのステップ1:認証を完了してください。
セッションが続く限り、稼働中のサーバーのアクセストークンを最新に保つ@deque/axe-auth runを使用してサーバーを起動します。
{
"mcpServers": {
"axe-mcp-server": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@deque/axe-auth",
"run",
"--",
"docker",
"run",
"--add-host=host.docker.internal:host-gateway",
"-i",
"--rm",
"-p",
"127.0.0.1:9223:9223",
"-e",
"AXE_ACCESS_TOKEN",
"-e",
"AXE_TOKEN_REFRESH_PORT",
"-e",
"AXE_TOKEN_REFRESH_SECRET",
"-e",
"AXE_TOKEN_REFRESH_HOST=0.0.0.0",
"dequesystems/axe-mcp-server:latest"
],
"env": {
"AXE_TOKEN_REFRESH_PORT": "9223"
}
}
}
}トークン更新はv1.5.0でaxe MCPサーバーに到達しました。npx -y @deque/axe-authは常に最新のCLIを取得しますが、そのリリース前にプルされたDockerイメージは、runにプッシュするための更新リスナーがありません — docker pull dequesystems/axe-mcp-server:latestで再プルしてください。
npx -y @deque/axe-auth runはコンテナを起動し、セッションの間、コンテナを監視します。現在のものが期限切れになる前に、新しく生成されたアクセス・トークンを動作中のサーバーにプッシュします。リフレッシュ・トークンは決してあなたのマシンを出ることはなく、短命のアクセス・トークンだけがサーバーに到達します。-yフラグは、非対話型シェルでnpxが通常求める最初の実行時の「進行してよろしいですか?」というプロンプトをスキップします。
残りのフラグは、そのプッシュをコンテナ内で到達可能にするために存在します。
-p 127.0.0.1:9223:9223はサーバーのリフレッシュ・リスナーをホストループバックのみに公開し、マシンの外部インターフェースからは外しています。-e AXE_ACCESS_TOKEN、-e AXE_TOKEN_REFRESH_PORT、および-e AXE_TOKEN_REFRESH_SECRETは、runが生成する値をコンテナに転送します。名前だけを渡し、=valueは付けないでください。runがそれらを提供します。-e AXE_TOKEN_REFRESH_HOST=0.0.0.0はリスナーをコンテナのネットワークインターフェースにバインドします。公開されたポートはそこで受け渡され、コンテナのループバックには至らないため、デフォルトのループバックバインドは到達不能になります。エンドポイントを守るのはコンテナの隔離ではなく、共有されたシークレットです。
9223は一例です — あなたのマシン上の任意の空いているポートが使用できますが、AXE_TOKEN_REFRESH_PORTと-pが同じ名前で公開する必要があります。完全なリファレンスについてはトークンリフレッシュ変数を参照してください。
地域別、プライベートクラウド、またはオンプレミスのAxeインスタンスを使用していますか? Add AXE_SERVER_URL to the Docker command and to the env block, alongside the refresh port:
"args": [
"-y",
"@deque/axe-auth",
"run",
"--",
"docker",
"run",
"--add-host=host.docker.internal:host-gateway",
"-i",
"--rm",
"-p",
"127.0.0.1:9223:9223",
"-e",
"AXE_SERVER_URL",
"-e",
"AXE_ACCESS_TOKEN",
"-e",
"AXE_TOKEN_REFRESH_PORT",
"-e",
"AXE_TOKEN_REFRESH_SECRET",
"-e",
"AXE_TOKEN_REFRESH_HOST=0.0.0.0",
"dequesystems/axe-mcp-server:latest"
],
"env": {
"AXE_TOKEN_REFRESH_PORT": "9223",
"AXE_SERVER_URL": "https://your-axe-instance.example.com"
}ログイン時に--serverに渡したのと同じURLを使用して、axe-authが発行するトークンがサーバーが呼び出すインスタンスから来るようにします。省略された場合、サーバーはデフォルトでhttps://axe.deque.com(Dequeの共有US SaaSインスタンス)を使用します。詳細はConfiguration Referenceを参照してください。
npm
npmディストリビューションはNode.jsで動作します。アクティブなNode.js LTSリリースを使用してください — 古いリリースはサポートされていない可能性があります。
npm配布版にはChromiumブラウザが必要です — Playwrightを使用してインストールするか、既存のバイナリを指す設定にします。詳細はディストリビューションの選択をご覧ください。
API キー
{
"mcpServers": {
"axe-mcp-server": {
"type": "stdio",
"command": "npx",
"args": ["-y", "axe-mcp-server"],
"env": {
"AXE_API_KEY": "${AXE_API_KEY}"
}
}
}
}Claude Codeが環境から取得できるように、AXE_API_KEYをシェルに、上記のように設定してください。
OAuth 2.0
OAuth 2.0はnpmディストリビューションでもサポートされています。サーバーは上記とまったく同様に@deque/axe-auth runでラップします。ポートを公開するコンテナがないため、コマンドは短くなります:
{
"mcpServers": {
"axe-mcp-server": {
"type": "stdio",
"command": "npx",
"args": [
"-y",
"@deque/axe-auth",
"run",
"--",
"npx",
"-y",
"axe-mcp-server"
],
"env": {
"AXE_TOKEN_REFRESH_PORT": "9223"
}
}
}
}npx -y @deque/axe-auth runはサーバーを起動し、セッションの存続期間中にそれを監視し、現在のトークンが期限切れになる前に新しく生成したアクセス・トークンを実行中のプロセスにプッシュします。ここではポート公開は必要ありません。ラップされたプロセスはAXE_TOKEN_REFRESH_PORTを直接継承し、リスナーはループバック上で待機します。9223は一例です — あなたのマシン上の任意の空きポートが機能し、この変数はオプションです: 省略するとrunがセッションのために空きポートを選択します。
コンテナとは異なり、npmディストリビューションはシェル環境全体を継承します。そこでAXE_API_KEYがエクスポートされている場合、それはOAuthトークンと共にサーバーに到達し、サーバーは起動を拒否します。エディタを起動するシェルでそれを解除するか、上記のDocker構成を使用してください。これにより、明示的な-eフラグで渡された変数のみを受け取ります。
完全なフローについては認証をご覧ください。
AXE_API_KEYかAXE_ACCESS_TOKENのどちらか一方を設定してください。両方の変数を設定すると、サーバーは起動時に失敗します。
使用と検証
設定後、Claude Codeを再起動してMCPサーバーをロードします。
- ターミナルからClaude Codeを起動します:
claude - MCP サーバー接続を管理するには
/mcpを入力します axe-mcp-serverが、analyze、remediate、igtツールと一緒に表示されるはずです
Claude Codeの設定(推奨)
Claude Codeがaxe MCPサーバーツールを正しく使用するために、推奨される「分析→修正」ワークフローの指示を、プロジェクトのルートにあるCLAUDE.mdファイルに追加します。完全なテンプレートはAIエージェントの設定をご覧ください。
