Signed Exchange（SXG）

SXG は、リソースの配信方法とは無関係に、リソースの送信元を認証できるようにする配信メカニズムです。

Katie Hempenius
Katie Hempenius
X
Devin Mullins
Devin Mullins
X GitHub

署名付き交換（SXG）は、リソースの配信方法とは無関係に、リソースの送信元を認証できるようにする配信メカニズムです。SXG を実装すると、プライバシーを保護するクロスオリジン プリフェッチが有効になり、Largest Contentful Paint（LCP）が改善される可能性があります。さらに、この分離により、オフラインのインターネット エクスペリエンスやサードパーティ キャッシュからの配信など、さまざまなユースケースが促進されます。

この記事では、SXG の仕組み、ユースケース、ツールなど、SXG の概要を包括的に説明します。

ブラウザの互換性

SXG は、Chromium ベースのブラウザ（Chrome 73、Edge 79、Opera 64 以降のバージョン）でサポートされています。

概要

SXG の主なユースケースは、キャッシュを使用して、オリジンによって暗号的に署名されたコンテンツをプリフェッチして提供することです。これにより、リファラー サイトからのクロスオリジン ナビゲーションが高速化されるとともに、ページが変更されず、オリジンに適切に帰属されるようになります。個人を特定できる可能性のある情報は、ユーザーがサイトに移動するまで非表示になり、ユーザーのプライバシーが保護されます。 Google 検索は SXG プリフェッチ機能を早期に導入しており、Google 検索からのトラフィックが多いサイトでは、SXG はユーザーにページを高速に読み込むための重要なツールとなります。今後、この影響が他のリファラーにも拡大していくことを期待しています。

仕組み

サイトは、コンテンツの配信方法とは無関係に、ブラウザがコンテンツの送信元と完全性を検証できるように、リクエスト / レスポンスのペア（「HTTP 交換」）に署名します。その結果、ブラウザは、コンテンツを配信したサーバーの URL ではなく、オリジンサイトの URL をアドレスバーに表示できます。

署名付き交換の仕組みを示す図。ブラウザがキャッシュと通信し、キャッシュがリンク先のサイトと通信する

これまで、サイトがサードパーティを使用してコンテンツを配信しながら、アトリビューションを維持する唯一の方法は、サイトが SSL 証明書を配信者と共有することでした。これにはセキュリティ上の欠点があり、さらに、コンテンツを真にポータブルにすることからはほど遠いものです。

SXG 形式

SXG は、2 つの主要なコンポーネント（HTTP 交換と、交換をカバーする署名）を持つバイナリ エンコード ファイルにカプセル化されます。HTTP 交換は、リクエスト URL、コンテンツ ネゴシエーション情報、HTTP レスポンスで構成されます。

以下に、デコードされた SXG ファイルの例を示します。

format version: 1b3
request:
  method: GET
  uri: https://example.org/
  headers:
response:
  status: 200
  headers:
    Cache-Control: max-age=604800
    Digest: mi-sha256-03=kcwVP6aOwYmA/j9JbUU0GbuiZdnjaBVB/1ag6miNUMY=
    Expires: Mon, 24 Aug 2020 16:08:24 GMT
    Content-Type: text/html; charset=UTF-8
    Content-Encoding: mi-sha256-03
    Date: Mon, 17 Aug 2020 16:08:24 GMT
    Vary: Accept-Encoding
signature:
    label;cert-sha256=<em>ViFgi0WfQ+NotPJf8PBo2T5dEuZ13NdZefPybXq/HhE=</em>;
    cert-url=&quot;https://test.web.app/ViFgi0WfQ-NotPJf8PBo2T5dEuZ13NdZefPybXq_HhE&quot;;
    date=1597680503;expires=1598285303;integrity=&quot;digest/mi-sha256-03&quot;;sig=<em>MEUCIQD5VqojZ1ujXXQaBt1CPKgJxuJTvFlIGLgkyNkC6d7LdAIgQUQ8lC4eaoxBjcVNKLrbS9kRMoCHKG67MweqNXy6wJg=</em>;
    validity-url=&quot;https://example.org/webpkg/validity&quot;
header integrity: sha256-Gl9bFHnNvHppKsv+bFEZwlYbbJ4vyf4MnaMMvTitTGQ=</p>

<p>The exchange has a valid signature.
payload [1256 bytes]:</p>
<pre class="prettyprint"><code>&lt;title&gt;SXG example&lt;/title&gt;
&lt;meta charset=&#34;utf-8&#34;&gt;
&lt;meta http-equiv=&#34;Content-type&#34; content=&#34;text/html; charset=utf-8&#34;&gt;
&lt;style type=&#34;text/css&#34;&gt;
body {
    background-color: #f0f0f2;
    margin: 0;
    padding: 0;
}
&lt;/style&gt;
</code></pre>
<div>
    <h1>Hello</h1>
</div>

<p>

署名の expires パラメータは、SXG の有効期限を示します。SXG の有効期間は最長 7 日間です。署名ヘッダーの詳細については、Signed HTTP Exchange の仕様をご覧ください。

サーバーサイドのパーソナライズのサポート

Vary: Cookie ヘッダーを含む SXG は、署名付きリクエスト URL の Cookie を持たないユーザーにのみ表示されます。ログインしたユーザーに異なる HTML を表示するサイトの場合、この機能を使用すると、そのエクスペリエンスを変更せずに SXG を利用できます。詳しくは、Dynamic SXG を使用したサーバーサイドのパーソナライズをご覧ください。

Web Packaging

SXG は、より広範な Web Packaging 仕様提案ファミリーの一部です。SXG に加えて、Web Packaging 仕様のもう 1 つの主要なコンポーネントは Web Bundle（「バンドルされた HTTP Exchange」）です。ウェブバンドルは、HTTP リソースと、バンドルを解釈するために必要なメタデータのコレクションです。

SXG とウェブバンドルの関係は、よくある混乱の原因です。SXG と Web Bundle は、互いに依存しない 2 つの異なるテクノロジーです。Web Bundle は、署名付き交換と署名なし交換の両方で使用できます。SXG とウェブバンドルの両方で推進されている共通の目標は、サイトをオフラインで使用するために全体を共有できる「ウェブ パッケージ」形式を作成することです。

Signed Exchange でページ読み込みを高速化

署名付き交換を有効にすると、ウェブページのパフォーマンスが向上し、サイトの Core Web Vitals、特に Largest Contentful Paint（LCP）に影響を与える可能性があります。Google 検索は、アーリー アドプターとして SXG を使用し、検索結果ページから読み込まれるページの読み込み速度を向上させています。

Google 検索は、利用可能な SXG をクロールしてキャッシュに保存し、ユーザーがアクセスする可能性の高い SXG（最初の検索結果に対応するページなど）をプリフェッチします。

SXG は、CDN の使用やレンダリングを妨げるサブリソースの削減など、他のパフォーマンス最適化と組み合わせることで、最大限の効果を発揮します。実装したら、こちらのおすすめの方法に沿って、SXG のプリフェッチによる LCP のメリットを最大化します。多くの場合、このような最適化により、Google 検索からのページ読み込みがほぼ瞬時に行われるようになります。

Signed Exchange の影響

過去のテストでは、SXG 対応のプリフェッチにより、LCP が平均 300 ～ 400 ミリ秒短縮されることが確認されています。これにより、サイトはユーザーに好印象を与えることができ、多くの場合、ビジネス指標にプラスの影響を与えます。

すでに複数のグローバル ブランドやサイトが、署名付き交換のメリットを享受しています。ケーススタディとして、著名なコンテンツ マネジメント システム（CMS）である RebelMouse が、Signed Exchange を実装することで、顧客のパフォーマンスとビジネス指標をどのように改善したかを見てみましょう。

  • Narcity、LCP を 41% 改善
  • Paper Magazine では、ユーザーあたりのセッション数が 27% 増加しました。
  • MLT Blog: ページの読み込み時間を 21% 短縮

Cloudflare の調査によると、SXG をテストしたサイトの 98% で TTFB が改善し、85% で LCP が改善しました。SXG の対象となるページ読み込みの中央値は 20% 以上改善しました。

インデックス登録

Google 検索では、ページの SXG 表現と非 SXG 表現のランキングやインデックス登録に違いはありません。SXG は、最終的には配信メカニズムであり、基盤となるコンテンツを変更するものではありません。

AMP

AMP コンテンツは SXG を使用して配信できます。SXG を使用すると、AMP コンテンツをプリフェッチして、AMP URL ではなく正規 URL を使用して表示できます。AMP には、SXG を生成するための独自のツールがあります。Signed Exchange を使用して AMP を配信する方法については、amp.dev をご覧ください。

Chrome DevTools を使用した SXG のデバッグ

SXG を実際に確認するには、Chromium ブラウザを使用し、DevTools を開いて、[ネットワーク] パネルを開き、こちらの検索ページの例にアクセスします。Signed Exchange は、[Type] 列で signed-exchange を探すことで識別できます。

DevTools の [Network] パネルに表示された SXG リクエストのスクリーンショット
DevTools の [ネットワーク] パネル

[プレビュー] タブには、SXG の内容に関する詳細情報が表示されます。

SXG の [プレビュー] タブのスクリーンショット
DevTools の [Preview] タブ

ツール

SXG を実装するには、特定の URL に対応する SXG を生成し、その SXG をリクエスト元（通常はクローラ）に提供します。

証明書

SXG を生成するには、SXG に署名できる証明書が必要です。ただし、一部のツールでは、これらの証明書が自動的に取得されます。こちらのページに、このタイプの証明書を発行できる認証局が記載されています。証明書は、任意の ACME クライアントを使用して Google 認証局から自動的に取得できます。Web Packager Server には ACME クライアントが組み込まれており、sxg-rs にもまもなく組み込まれる予定です。

プラットフォーム固有の SXG ツール

これらのツールは、特定の技術スタックをサポートしています。これらのツールのいずれかでサポートされているプラットフォームをすでに使用している場合は、汎用ツールよりも簡単に設定できる可能性があります。

汎用 SXG ツール

sxg-rs HTTP サーバー

sxg-rs http_server は、SXG を提供するためのリバース プロキシとして機能します。SXG クローラーからのリクエストの場合、http_server はバックエンドからのレスポンスに署名し、SXG で応答します。インストール手順については、README をご覧ください。

Web Packager サーバー

Web Packager サーバー（webpkgserver）は、Go で記述された sxg-rs http_server の代替手段です。Web Packager サーバーの設定手順については、Web Packager を使用して Signed Exchange を設定する方法をご覧ください。

Web Packager CLI

Web Packager CLI は、指定された URL に対応する SXG を生成します。

webpackager \
    --private\_key=private.key \
    --cert\_url=https://example.com/certificate.cbor \
    --url=https://example.com

SXG ファイルが生成されたら、サーバーにアップロードし、application/signed-exchange;v=b3 MIME タイプで提供します。また、SXG 証明書を application/cert-chain+cbor として提供する必要があります。

SXG ライブラリ

これらのライブラリを使用して、独自の SXG 生成ツールを構築できます。

  • sxg_rs は、SXG を生成するための Rust ライブラリです。これは最も機能が豊富な SXG ライブラリであり、cloudflare_worker ツールと fastly_compute ツールのベースとして使用されます。

  • libsxg は、SXG を生成するための最小限の C ライブラリです。NGINX SXG モジュールと Envoy SXG フィルタのベースとして使用されます。

  • go/signed-exchange は、SXG を生成するリファレンス実装としてウェブパッケージ仕様で提供される最小限の Go ライブラリです。これは、リファレンス CLI ツール gen-signedexchange と、より機能豊富な Web Packager ツールのベースとして使用されます。

コンテンツ ネゴシエーション

サーバーは、Accept ヘッダーで application/signed-exchange の q 値が text/html の q 値以上であることが示されている場合に、SXG を提供する必要があります。実際には、配信元サーバーはクローラーに SXG を提供しますが、ブラウザには提供しません。上記のツールの多くはデフォルトでこれを行いますが、他のツールでは、次の正規表現を使用して、SXG として提供されるリクエストの Accept ヘッダーを照合できます。 http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/

この推奨事項には、Apache と nginx の例が含まれています。

Update Cache API

Google SXG キャッシュには、サイト所有者が Cache-Control: max-age による有効期限が切れる前にキャッシュから SXG を削除するために使用できる API があります。詳細については、キャッシュ更新 API リファレンスをご覧ください。

SXG へのリンク

どのサイトでも、 タグと タグを使用して、リンク先のページの SXG をキャッシュ、配信、プリフェッチできます（利用可能な場合）。 html <a href="https://example.com/article.html.sxg"> <link rel="prefetch" as="document" href="https://example.com/article.html.sxg"> こちらの記事では、nginx を使用して SXG を配信する方法を説明しています。

独自のメリット

SXG は、クロスオリジンのプリフェッチを可能にする多くのテクノロジーの 1 つです。どのテクノロジーを使用するかを決定する際には、さまざまな側面を最適化するトレードオフが必要になる場合があります。以下のセクションでは、SXG が提供する独自の価値について、考えられるソリューションの観点からいくつか説明します。これらの要因は、利用可能なソリューションの範囲が進化するにつれて、時間の経過とともに変化する可能性があります。

処理するリクエストの減少

クロスサイト プリフェッチを使用すると、サーバーが追加のリクエストを処理しなければならない場合があります。これは、ページがプリフェッチされたものの、ユーザーがページにアクセスしなかったか、プリフェッチされたバイトをユーザーに表示できなかった場合に該当します。SXG を使用すると、こうした未使用の追加リクエストを大幅に削減できます。

  • SXG はキャッシュに保存され、有効期限が切れるまでユーザーに送信される可能性があります。そのため、多くのプリフェッチはキャッシュ サーバーだけで処理できます。
  • SXG は、サイトの Cookie を持つユーザーと持たないユーザーの両方に表示できます。そのため、ナビゲーション後にページを再度取得する必要がある回数が減ります。

Page Speed の改善

現在サポートされているプリフェッチ サーフェスと機能により、Page Speed がさらに向上する可能性があります。

  • SXG は、サイトの Cookie を持つユーザーに表示されることがあります。
  • また、Link ヘッダーを使用して指定すると、JavaScript、CSS、フォント、画像などのページのサブリソースもプリフェッチされます。
  • 近い将来、Google 検索からの SXG プリフェッチは、より多くの検索結果タイプで利用できるようになります。

まとめ

Signed Exchange は、リソースの配信方法とは無関係に、リソースのオリジンと有効性を検証できるようにする配信メカニズムです。その結果、パブリッシャーの帰属を完全に維持しながら、サードパーティが SXG を配信できます。

関連情報