Signed Exchange (SXG)

SXG 是一种传送机制，可让您独立于资源的传送方式来验证资源的来源。

Katie Hempenius
Katie Hempenius
X
Devin Mullins
Devin Mullins
X GitHub

Signed Exchange (SXG) 是一种传送机制，可让您对资源的来源进行身份验证，而无需考虑资源的传送方式。实现 SXG 可通过启用可保护隐私的跨域预提取来改善 Largest Contentful Paint (LCP)。此外，这种解耦还推动了各种应用场景的发展，例如离线互联网体验和通过第三方缓存提供服务。

本文全面概述了 SXG：其工作原理、用例和工具。

浏览器兼容性

基于 Chromium 的浏览器（从 Chrome 73、Edge 79 和 Opera 64 版本开始）支持 SXG。

概览

在主要应用场景中，SXG 会使用缓存来预提取和提供已经过来源加密签名的内容。这有助于加快从引荐来源网址进行的跨源导航，同时确保网页保持不变并正确归因于其源。在用户访问网站之前，任何可能泄露身份信息的信息都会被隐藏，从而保护用户的隐私。Google 搜索是 SXG 预提取功能的尝鲜者，对于大部分流量来自 Google 搜索的网站，SXG 可以成为向用户提供更快网页加载速度的重要工具。随着时间的推移，我们希望这种影响能扩大到更多引荐来源。

运作方式

网站会以某种方式对请求/响应对（“HTTP 交换”）进行签名，以便浏览器能够验证内容的来源和完整性，而无需考虑内容的分发方式。因此，浏览器可以在地址栏中显示来源网站的网址，而不是传送内容的服务器的网址。

说明 Signed Exchange 工作原理的图表。浏览器与缓存通信，缓存与目标网站通信

过去，网站要想使用第三方分发其内容，同时保持归因，唯一的方法就是与分发方共享其 SSL 证书。这存在安全缺陷；此外，它与实现内容真正可移植的目标相去甚远。

SXG 格式

SXG 封装在二进制编码文件中，该文件包含两个主要组件：HTTP 交换和涵盖该交换的签名。HTTP 交换由请求网址、内容协商信息和 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 (SXG) 规范。

支持服务器端个性化

包含 Vary: Cookie 标头的 SXG 将仅向没有签名请求网址 Cookie 的用户显示。如果您的网站向登录用户呈现不同的 HTML，您可以使用此功能来利用 SXG，而无需改变这种体验。请参阅使用动态 SXG 进行服务器端个性化的详细信息。

Web 打包

SXG 是更广泛的网页打包规范提案系列的一部分。除了 SXG 之外，Web Packaging 规范的另一个主要组件是 Web Bundle（“捆绑式 HTTP 交换”）。Web 软件包是 HTTP 资源和解释该软件包所需的元数据的集合。

SXG 与 Web Bundle 之间的关系是常见的混淆点。 SXG 和 Web Bundle 是两种不同的技术，彼此不相互依赖，Web Bundle 既可以与 Signed Exchange 搭配使用，也可以与 Unsigned Exchange 搭配使用。SXG 和 Web Bundle 共同推进的一个目标是创建一种“Web 打包”格式，以便完整共享网站以供离线使用。

利用 Signed Exchange 提高网页加载速度

启用 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 毫秒。这有助于网站给用户留下更好的第一印象，并且通常会对业务指标产生积极影响。

多个全球品牌和网站已从 Signed Exchange 中受益。我们来看一个案例研究，了解知名内容管理系统 (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 内容。AMP 有自己单独的工具来生成 SXG。如需了解如何使用 Signed Exchange 提供 AMP 内容，请访问 amp.dev。

使用 Chrome 开发者工具调试 SXG

如需亲眼看看 SXG，请使用 Chromium 浏览器，打开开发者工具，打开“网络”面板，然后访问此示例搜索页。您可以通过在类型列中查找 signed-exchange 来识别 Signed Exchange。

屏幕截图：开发者工具中“Network”（网络）面板内的 SXG 请求
开发者工具中的网络面板

预览标签页会提供有关 SXG 内容的更多信息。

SXG 的“预览”标签页屏幕截图
开发者工具中的预览标签页

工具

实现 SXG 的过程包括：生成与给定网址对应的 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 进行响应。如需了解安装说明，请参阅自述文件。

Web Packager 服务器

Web Packager 服务器 webpkgserver 是 sxg-rs http_server 的替代方案，采用 Go 语言编写。如需了解如何设置 Web Packager 服务器，请参阅如何使用 Web Packager 设置 Signed Exchange。

Web Packager CLI

Web Packager CLI 会生成与给定网址对应的 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 是一个极简 Go 库，由 webpackage 规范提供，作为生成 SXG 的参考实现。它用作其参考 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 的示例。

更新缓存 API

Google SXG 缓存提供了一个 API，网站所有者可以使用该 API 在 SXG 因 Cache-Control: max-age 而过期之前将其从缓存中移除。如需了解详情，请参阅更新缓存 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 是众多可实现跨域预提取的技术之一。在决定使用哪种技术时，您可能需要在优化不同方面之间进行权衡。以下部分介绍了 SXG 在可能的解决方案领域提供的一些独特价值。随着可用解决方案领域的不断发展，这些因素可能会随时间而变化。

需要处理的请求更少

启用跨网站预提取后，您的服务器可能需要处理更多请求。这对应于以下情况：网页已预提取，但用户未访问该网页，或者无法向用户显示预提取的字节。对于 SXG，这些额外的未使用请求可以显著减少：

  • SXG 会被缓存，并且可能会在过期之前发送给用户。因此，许多预提取请求可以仅由缓存服务器处理。
  • SXG 可以向您网站上具有和不具有 Cookie 的用户显示。因此，在导航后需要再次提取页面的次数会减少。

网页速度提升

由于预提取功能目前支持的界面和功能，您可能会看到网页速度进一步提升：

  • SXG 可以向拥有您网站 Cookie 的用户显示。
  • 如果使用 Link 标头指定，SXG 还会为您的网页预提取子资源，例如 JavaScript、CSS、字体和图片。
  • 在不久的将来，Google 搜索中的 SXG 预提取功能将适用于更多搜索结果类型。

总结

Signed Exchange 是一种传送机制，可让您独立于资源的传送方式来验证资源的来源和有效性。因此，SXG 可以由第三方分发，同时保持完整的发布商归因。

深入阅读