mcpField
A
accessibility-scanner-mcp

accessibility-scanner-mcp

ローカル
github.com/Bishop81開発ツール04 週間前に更新

accessibility-scanner-mcp について

accessibility-scanner-mcpは、WCAGの自動判定可能な項目をエージェントが調べるためのMCPサーバーです。ローカルのChromeでaxe-coreを実行し、要素ごとの問題と修正ガイドを返すほか、人による確認が必要な項目も示します。

主な機能

  1. 01axe-coreによるURLスキャン
  2. 02重大度別の違反分類
  3. 03要素セレクターとHTMLの提示
  4. 04WCAG基準と修正ガイドの提示
  5. 05手動確認が必要な項目の表示
  6. 06遅延読み込みコンテンツの確認

活用シーン

  1. 01ウェブページのWCAG問題の監査
  2. 02ページ内の修正対象要素の特定
  3. 03コード変更後のページ再スキャン

MCP 対応

MCPサーバーはscan_accessibilityツールを公開し、URLを受け取ってMCPクライアントにWCAGの検出結果を返します。既定ではローカルでスキャンし、SCANNER_API_URLを設定するとaccessibilityscanner.appで実行します。

設定

ローカルサーバーの設定はどのクライアントでも共通です。コピーしてクライアントの MCP 設定ファイルに貼り付けてください。

mcp.json · 共通設定
{
"mcpServers": {
"bishop81-accessibility-scanner": {
"command": "npx",
"args": [
"-y",
"accessibility-scanner-mcp"
],
"env": {
"CHROME_PATH": "<CHROME_PATH>"
}
}
}
}
起動コマンドnpx -y accessibility-scanner-mcp
設定が必要な環境変数
CHROME_PATHPath to a Chrome/Chromium binary, if not auto-detected.

ローカルサーバーにはマシン上の実行環境(Node.js 18 以上など)が必要です。設定ファイルの場所はクライアントごとに異なります。

パッケージ
npmaccessibility-scanner-mcp0.1.2

ツール

1

掲載時のツール一覧 · 2 週間前に更新

パラメーター型必須説明
urlstringはいスキャンするページの http(s) URL。

詳細

accessibility-scanner-mcp

AI エージェントがウェブページをスキャンしてWCAG のアクセシビリティ上の問題を見つけ、対応可能な結果を受け取れるMCPサーバーです。エージェントが URL を指定してツールを呼び出すと、重大度別に分類されたすべての違反が返されます。各項目には、正確な要素セレクター、問題のある HTML、具体的な失敗内容、WCAG の達成基準、修正ガイドへのリンクが含まれます。また、人による確認が必要な項目も返されます。

実際のaxe-coreエンジンをローカルの Chrome(playwright-core経由)で実行するため、スキャンしたページの情報がマシンの外に送信されることはありません。ページをあらかじめスクロールするので、遅延読み込みコンテンツも見落とされることなく実際にチェックされます。また、ほとんどのツールが「要確認」のままにする CSS グラデーション上の色のコントラストも判定します。

0.1.x からアップグレードする場合:0.2.0 では各ページのより多くの範囲を確認し、同じ URL からより多くの結果を返します。 CHANGELOG.mdをご覧ください。

accessibilityscanner.appの一部です。

要件

  • Node.js 18+
  • Chromium ベースのブラウザー:Chrome、Chromium、Edge の順に自動検出します。特定の実行ファイルを指定する場合は、CHROME_PATHを設定してください。Playwright によってすでにインストールされているブラウザーは最後の手段として使用されます。ブラウザーがダウンロードされることはありません。
ブラウザーを使わない場合

SCANNER_API_URLを設定すると、ローカルではなく accessibilityscanner.app 上でスキャンが実行されます。

{ "env": { "SCANNER_API_URL": "https://accessibilityscanner.app" } }

アカウントもキーも不要です。ウェブサイトのフォームが使用するものと同じ公開エンドポイントを利用します。CI、コンテナー内、またはブラウザーをインストールできない環境で便利です。ホスト型スキャンでは、ローカルスキャナーではまだ計算できない、コントラストの問題に対する修正用の色の候補も表示されます。

⚠️ このモードでは、スキャン対象の URL が当社のサーバーに送信されます。ローカルで実行する場合、情報が外部に送信されることはありません。デフォルトはローカル実行で、ホスト型モードはこの環境変数を設定した場合のみ有効になります。

インストール

MCP クライアントの設定に追加してください。グローバルインストールは不要です。初回実行時にnpxが取得します。

Claude Desktop(claude_desktop_config.json)、Cursor、Claude Code、または任意の MCP クライアント:

{
  "mcpServers": {
    "accessibility-scanner": {
      "command": "npx",
      "args": ["-y", "accessibility-scanner-mcp"]
    }
  }
}

Chrome が自動検出されない場合は、env ブロックを追加してください。

{
  "mcpServers": {
    "accessibility-scanner": {
      "command": "npx",
      "args": ["-y", "accessibility-scanner-mcp"],
      "env": { "CHROME_PATH": "/usr/bin/google-chrome" }
    }
  }
}

ツール

scan_accessibility
入力
url(文字列、必須)スキャンする http(s) URL です。

重大度別に分類されたレポートを返します。各ルールについて、WCAG の達成基準、修正ガイドへのリンク、各要素のセレクター、HTML、具体的な失敗内容が含まれます。エージェントを使った場合の流れの例:

あなた: https://example.com のアクセシビリティを監査し、可能な範囲で修正してください。 エージェント: (scan_accessibilityを呼び出す) → 結果を確認 → コードを編集 → 再スキャン。

制限事項について

自動テストで確認できるのは、機械的に判定可能な WCAG の範囲です(一般的なページの問題の多くを確認できますが、すべてではありません)。人の判断が必要な項目は「手動レビューが必要」の下に返されます。ページが「準拠している」と断言することはありません。

ライセンス

MIT

コメント

MCP は初めてですか?

プロトコルの概要から最初のサーバーの導入まで、よくある疑問にまとめて答えます。

AI アプリケーションが外部のツールやデータソースに統一的な方法で接続するためのオープンなプロトコルです。クライアントはモデルとの対話を担い、MCP サーバーはツール・リソース・プロンプトテンプレートを提供します。標準メッセージでやり取りするため、1 つのサーバーを複数のクライアントで再利用できます。