Signed Exchange (SXG)

SXG 是一种传送机制,可让您验证资源的来源,而无需考虑其传送方式。

Katie Hempenius
Katie Hempenius
Devin Mullins
Devin Mullins

签名交换 (SXG) 是一种提交机制,可独立于资源提交方式来对资源的来源进行身份验证。通过启用可保护隐私的跨源预提取,实现 SXG 可以改善 Largest Contentful Paint (LCP)。此外,这种解耦还可以改进各种应用场景,例如离线互联网体验和从第三方缓存中提供内容。

本文将全面介绍 SXG:其工作原理、用例和工具。

浏览器兼容性

基于 Chromium 的浏览器(Chrome 73、Edge 79 和 Opera 64 及更高版本)支持 SXG。

概览

作为其主要用例,SXG 使用缓存来预提取和传送已由来源进行加密签名的内容。这有助于加快从引荐来源网站进行跨源导航的速度,同时确保网页保持不变,并正确归因于其来源。在用户导航到某个网站之前,系统会隐藏所有可能用于识别用户身份的信息,从而保护用户的隐私。 Google 搜索是 SXG 预提取功能的早期采用者。对于从 Google 搜索获得大量流量的网站,SXG 可以成为向用户提供更快网页加载速度的重要工具。我们希望随着时间的推移,这种影响会扩大到更多引荐来源。

具体用法

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

一张示意图,说明已签名广告交易的运作方式。浏览器与缓存通信,缓存与目标网站通信

过去,网站若要使用第三方分发其内容并保持归因,唯一的方法是网站与分销商共享其 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 Exchanges 规范

支持服务器端个性化

包含 Vary: Cookie 标头的 SXG 将仅向没有签名请求网址 Cookie 的用户显示。如果您的网站向已登录的用户显示不同的 HTML,您可以使用此功能来利用 SXG,而无需更改用户体验。详细了解如何使用动态 SXG 实现服务器端个性化

Web 打包

SXG 属于更广泛的 Web Packaging 规范提案系列。除了 SXG 之外,Web 打包规范的另一个主要组成部分是网站软件包(“捆绑的 HTTP 交换”)。Web 软件包是 HTTP 资源和解读软件包所需的元数据的集合。

SXG 与 Web Bundle 之间的关系是一个常见的困惑点。SXG 和 Web Bundle 是两种不同的技术,彼此之间没有依赖关系。Web Bundle 可与 Signed Exchange 和 Unsigned Exchange 搭配使用。SXG 和 Web Bundle 共同追求的一个目标是创建一种“网站打包”格式,以便网站能够完整共享以供离线使用。

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

多家全球品牌和网站已从已签名广告交易中受益。下面以一个案例为例,介绍实现已签名广告交易如何帮助知名内容管理系统 (CMS) 提供商 RebelMouse 提升客户的广告效果和业务指标:

  • 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 浏览器,打开 DevTools,打开“Network”面板,然后访问此示例搜索页面。您可以在类型列中查找 signed-exchange,以识别已签名广告交易。

屏幕截图:显示 DevTools 的“Network”(网络)面板中的 SXG 请求
DevTools 中的网络面板

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

SXG 的“预览”标签页的屏幕截图
DevTools 中的预览标签页

工具

实现 SXG 包括生成与给定网址对应的 SXG,然后将该 SXG 提供给请求方(通常是抓取工具)。

证书

如需生成 SXG,您需要具有可对 SXG 签名的证书,但某些工具会自动获取这些证书。此页面列出了可以颁发此类证书的证书授权机构。您可以使用任何 ACME 客户端自动从 Google 证书授权机构获取证书。Web 打包工具服务器内置了 ACME 客户端,sxg-rs 也将很快推出。

平台专用 SXG 工具

这些工具支持特定的技术栈。如果您已经在使用某个工具支持的平台,那么与通用工具相比,您可能会发现该平台的设置更为简单。

通用 SXG 工具

sxg-rs HTTP 服务器

sxg-rs http_server 充当用于分发 SXG 的反向代理。对于来自 SXG 抓取工具的请求,http_server 会对来自后端的响应进行签名,并使用 SXG 进行响应。如需了解安装说明,请参阅自述文件

Web 打包容器服务器

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

Web 打包工具 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_workerfastly_compute 工具的基础。

  • libsxg 是一个用于生成 SXG 的最小 C 库。它可用作 NGINX SXG 模块和 Envoy SXG 过滤器的基础。

  • go/signed-exchange 是 Web 软件包规范提供的一个极小的 Go 库,作为生成 SXG 的参考实现。它是其参考 CLI 工具 gen-signedexchange 和功能更丰富的 Web 打包工具的基础。

内容协商

如果 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 提供了一个 API,网站所有者可以使用该 API 在 SXG 因 Cache-Control: max-age 而过期之前从缓存中移除 SXG。如需了解详情,请参阅 update cache 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 会被缓存,并可能会在过期之前发送给用户。因此,许多预提取操作可以完全由缓存服务器处理。
  • 您可以在网站上向有 Cookie 和无 Cookie 的用户展示 SXG。因此,在导航后需要再次提取网页的次数会减少。

网页速度提升

由于它目前支持的预加载途径和功能,您可能会看到网页速度进一步提升:

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

总结

经过签名的广告交易是一种提交机制,可让您验证资源的来源和有效性,而无需考虑资源的提交方式。因此,第三方可以分发 SXG,同时保持完整的发布商归因。

深入阅读