プライベート ネットワーク アクセス権限プロンプトのオリジン トライアル: HTTPS を使用してウェブサイトを移行するパス

Yifan Luo
Yifan Luo
GitHub

背景

Chrome 94 では、安全でない公開ウェブサイトからのプライベート ネットワーク アクセスをブロックする機能が導入されました。現在実施中のセキュアでないコンテキストからのプライベート ネットワーク アクセスのサポート終了トライアルでは、影響を受けるウェブサイトを HTTPS に移行する際の課題が明らかになりました。よくある懸念として、個人用デバイスを HTTPS に移行することが困難で、混合コンテンツ チェック違反につながることがあります。

前述の課題に対処するため、Chrome 120 のオリジン トライアルで、新しい権限プロンプトが利用可能になりました。

新しいオプションとして権限プロンプト

新しい targetAddressSpace 属性を取得オプションとして追加すると、リクエストで混合コンテンツのチェックをスキップできます。

例:

fetch("http://router.local/ping", {
  targetAddressSpace: "private",
});

プライベート ネットワーク アクセス: プリフライトの概要に従い、すべてのプライベート ネットワーク リクエストの前にプリフライト リクエストが行われます。このプリフライト リクエストには新しいヘッダー Access-Control-Request-Private-Network: true が含まれ、対応するレスポンスにはヘッダー Access-Control-Allow-Private-Network: true を含める必要があります。

新しい権限プロンプトに対応するため、デバイスに 2 つの新しいレスポンス ヘッダー（Private-Network-Access-Name と Private-Network-Access-ID）を組み込む必要がありました。

Private-Network-Access-Name: <some human-readable device name>
Private-Network-Access-ID: <the MAC address of the device>

例:

Private-Network-Access-Name: "My Smart Toothbrush"
Private-Network-Access-ID: "01:23:45:67:89:0A"

Private-Network-Access-ID: コロンで区切られた 6 つの 16 進バイトとして表される 48 ビット値。Private-Network-Access-Name: ECMAScript 正規表現 /^[a-z0-9_-.]+$/ に一致する文字列として有効な名前。名前の最大長は 248 UTF-8 コード単位です。

デモ

デモは https://private-network-access-permission-test.glitch.me/ で確認できます。

オリジン トライアルに登録する

プライベート ネットワーク アクセス権限プロンプトが、デベロッパーがプライベート ネットワーク アクセスにセキュアなコンテキストの制限を適用する際に役立つように、Chrome バージョン 120 ～ 122 でオリジン トライアルとして提供します。

オリジン トライアルに登録して、ウェブサイトで権限プロンプトを使用できるようにします。

  1. 送信元のトークンをリクエストします。
  2. トークンは、次のいずれかの方法で使用します。
    • HTML で: html <meta http-equiv="Origin-Trial" content="TOKEN_GOES_HERE">
    • JavaScript の場合: js const meta = document.createElement('meta'); meta.httpEquiv = 'Origin-Trial'; meta.content = 'TOKEN_GOES_HERE'; document.head.append(meta);
    • HTTP ヘッダー: text Origin-Trial: TOKEN_GOES_HERE

この機能に関するフィードバックや提案がございましたら、GitHub リポジトリで問題を報告してください。

リソース