mcpField
D
domain-mask

domain-mask

github.com/adobe開発316235 回インストール今日更新
リポジトリ

domain-mask について

domain-maskは、デモや録画で実際のWebページをカスタムドメインで表示するスキルです。mkcertの信頼済み証明書を使うローカルHTTPSリバースプロキシを起動し、hosts設定も管理します。macOS限定で、1回につき1ドメインを扱います。

主な機能

  1. 01表示用ドメインでターゲットURLをプロキシ
  2. 02ローカルHTTPSリバースプロキシで配信
  3. 03mkcertで信頼済み証明書を生成
  4. 04hostsファイルの項目を追加・削除
  5. 051回の実行につき表示用ドメインは1つ

活用シーン

  1. 01デモのアドレスバーに整ったドメインを表示
  2. 02カスタムドメインでWebページを録画
  3. 03信頼済みのローカルHTTPSで対象サイトをプレビュー

インストール

コマンドをコピーしてターミナルで実行します。

$npx skills add https://github.com/adobe/skills --skill domain-mask

インストール後、Claude Code で/domain-maskを入力して読み込まれたか確認します。

同梱ファイル.releaserc.jsonpackage.json

詳細

domain-mask

デモや録画で、URL をカスタムドメインの背後に隠します。HTTPS リバース プロキシによって、実際の URL(例:https://main--mysite--org.aem.page)から コンテンツを配信しながら、アドレスバーには分かりやすいドメイン(例:wknd.adventures)を 表示できます。mkcert による信頼済み証明書を使うため、ブラウザーに警告は表示されません。

要件

  • Node 22 以降、mkcert(brew install mkcert && mkcert -install)、sudo(ポート 443 と /etc/hosts 用)
  • web CLI(このコマンドでは playwright-cli は必要ありません)。一度だけ場所を確認します:
# <skill-dir> is the directory containing this SKILL.md
WEB=$(command -v web || echo "node <skill-dir>/../../cli/dist/web.mjs")

その後、$WEB … を実行します。標準出力には JSON ドキュメントが 1 つだけ出力されるため、 $WEB … > file.json としても問題ありません。 公開後の代替手段:npx -y @adobe/web-cli。絶対パスの <skill-dir> を使用してください。そこへ cd しないでください。

ワークフロー

ステップ 1:入力を収集する

ユーザーに次の情報を尋ねる(またはメッセージから抽出する):

  • 表示ドメイン:表示するドメイン(例:wknd.adventures)
  • ターゲット URL:プロキシ先の実際の URL(例:https://gabrielwalt.github.io)
ステップ 2:前提条件を確認する
which mkcert || echo "Install mkcert: brew install mkcert && mkcert -install"

mkcert が見つからない場合は、インストールして mkcert -install を一度実行するようユーザーに伝えます。

ステップ 3:ユーザーにプロキシを起動してもらう

このコマンドは sudo パスワードを求め、Ctrl+C が押されるまでフォアグラウンドで動作するため、ユーザー自身のターミナルで実行してもらいます。WEB を解決済みの形式に置き換えたコマンドを伝えます:

sudo env CAROOT="$(mkcert -CAROOT)" $WEB mask "<display-domain>" "<target-url>"

CAROOT は sudo の前に解決されます。そのため、mkcert は root のホームディレクトリにある CA ではなく、ユーザーがインストールした CA で署名します。root のホームディレクトリにある CA はブラウザーに信頼されません。 root 権限がない場合、コマンドは 2(USAGE)で終了します。

このコマンドは /etc/hosts に 127.0.0.1 <display-domain> を追加し、mkcert で信頼済み証明書を生成して、ポート 443 で HTTPS リバースプロキシを起動し、 { url, displayDomain, targetUrl } を出力します。

次のようにユーザーに伝えます:

  • https://<display-domain> を開くと、アドレスバーに鍵アイコンとともに表示ドメインが表示されます
  • 完了したら Ctrl+C を押します。hosts エントリーが削除され、証明書がクリーンアップされます
ステップ 4:クリーンアップを確認する

ユーザーがプロキシを停止した後、hosts エントリーが削除されたことを確認します(出力がなければクリーンです):

grep -Fx '127.0.0.1 <display-domain>' /etc/hosts

行が残っている場合は、ユーザーに削除してもらいます。. をエスケープして sed がその行だけに一致するようにします。例として wknd.adventures の場合:

sudo sed -i '' '/^127\.0\.0\.1 wknd\.adventures$/d' /etc/hosts

制限事項

  • macOS のみ(/etc/hosts のパス、brew install mkcert)
  • sudo が必要です(特権ポート 443 と hosts ファイル)
  • 1 回の実行につき表示ドメインは 1 つです
  • HTML/CSS/JS のレスポンス本文内の URL は書き換えません

コメント