SXG — это механизм доставки, который позволяет аутентифицировать происхождение ресурса независимо от того, как он был доставлен.
Подписанные обмены (SXG) — это механизм доставки, который позволяет аутентифицировать происхождение ресурса независимо от того, как он был доставлен. Внедрение SXG может улучшить функцию Largest Contentful Paint (LCP), включив предварительную выборку между источниками с сохранением конфиденциальности . Кроме того, такое разделение расширяет возможности различных вариантов использования, таких как работа в автономном режиме в Интернете и обслуживание из сторонних кэшей.
В этой статье представлен полный обзор SXG: как он работает, варианты использования и инструменты.
Совместимость с браузером
SXG поддерживается браузерами на базе Chromium (начиная с версий: Chrome 73, Edge 79 и Opera 64).
Обзор
В качестве основного варианта использования SXG использует кеш для предварительной выборки и обслуживания контента, который был криптографически подписан источником. Это помогает ускорить навигацию между источниками с ссылающихся сайтов, а также гарантирует, что страницы останутся неизменными и будут правильно отнесены к их происхождению. Любая потенциально идентифицирующая информация скрыта до тех пор, пока пользователь не перейдет на сайт, тем самым защищая конфиденциальность пользователя. Google Search является одним из первых, кто внедрил возможности предварительной загрузки SXG, и для сайтов, которые получают большую часть своего трафика из Google Search, SXG может стать важным инструментом для обеспечения более быстрой загрузки страниц для пользователей. Мы надеемся, что со временем это влияние распространится и на дополнительных рефереров.
Как это работает
Сайт подписывает пару запрос/ответ («HTTP-обмен») таким образом, чтобы браузер мог проверить происхождение и целостность контента независимо от того, как контент был распространен. В результате браузер может отображать URL-адрес исходного сайта в адресной строке, а не URL-адрес сервера, доставившего контент.
Исторически сложилось так, что единственным способом использования сайта третьей стороны для распространения своего контента, сохраняя при этом атрибуцию, было предоставление сайтом своих SSL-сертификатов дистрибьютору. Это имеет недостатки с точки зрения безопасности; более того, до того, чтобы сделать контент по-настоящему переносимым, еще очень далеко.
Формат SXG
SXG инкапсулируется в файл с двоичной кодировкой , который состоит из двух основных компонентов: обмена HTTP и подписи , охватывающей обмен. Обмен HTTP состоит из URL-адреса запроса, информации о согласовании контента и ответа HTTP.
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="https://test.web.app/ViFgi0WfQ-NotPJf8PBo2T5dEuZ13NdZefPybXq_HhE"; date=1597680503;expires=1598285303;integrity="digest/mi-sha256-03";sig=<em>MEUCIQD5VqojZ1ujXXQaBt1CPKgJxuJTvFlIGLgkyNkC6d7LdAIgQUQ8lC4eaoxBjcVNKLrbS9kRMoCHKG67MweqNXy6wJg=</em>; validity-url="https://example.org/webpkg/validity" header integrity: sha256-Gl9bFHnNvHppKsv+bFEZwlYbbJ4vyf4MnaMMvTitTGQ=</p> <p>The exchange has a valid signature. payload [1256 bytes]:</p> <pre class="prettyprint"><code><title>SXG example</title> <meta charset="utf-8"> <meta http-equiv="Content-type" content="text/html; charset=utf-8"> <style type="text/css"> body { background-color: #f0f0f2; margin: 0; padding: 0; } </style> </code></pre> <div> <h1>Hello</h1> </div> <p>
Параметр expires
в подписи указывает дату истечения срока действия SXG. SXG может быть действителен не более 7 дней. Дополнительную информацию о заголовке подписи можно найти в спецификации Signed HTTP Exchanges .
Поддержка персонализации на стороне сервера
SXG, содержащий заголовок Vary: Cookie
будет показан только пользователям, у которых нет файлов cookie для URL-адреса подписанного запроса. Если ваш сайт предоставляет вошедшим в систему пользователям другой HTML-код, вы можете использовать эту функцию, чтобы воспользоваться преимуществами SXG, не изменяя этого опыта. См. подробную информацию о персонализации на стороне сервера с помощью Dynamic SXG .
Веб-упаковка
SXG является частью более широкого семейства спецификаций веб-упаковки . Помимо SXG, другим важным компонентом спецификации веб-упаковки являются веб-пакеты («пакетные обмены HTTP»). Веб-пакеты — это набор HTTP-ресурсов и метаданных, необходимых для интерпретации пакета.
Отношения между SXG и веб-пакетами часто вызывают путаницу. SXG и веб-пакеты — это две разные технологии, которые не зависят друг от друга: веб-пакеты можно использовать как с подписанными, так и с неподписанными обменами. Общей целью, которую преследуют как SXG, так и Web Bundles, является создание формата «веб-упаковки», который позволяет совместно использовать сайты целиком для автономного использования.
Ускорение загрузки страниц с помощью подписанных обменов
Включение подписанных обменов может помочь повысить производительность веб-страницы и тем самым повлиять на основные веб-показатели вашего сайта, в частности на крупнейшую содержательную отрисовку (LCP) . Будучи одним из первых пользователей, Google Search использует SXG, чтобы обеспечить пользователям более быструю загрузку страниц, загружаемых со страницы результатов поиска.
Поиск Google сканирует и кэширует файлы SXG, если они доступны, а также предварительно выбирает файлы SXG, которые пользователь, скорее всего, посетит, например страницу, соответствующую первому результату поиска.
SXG лучше всего работает в сочетании с другими оптимизациями производительности, такими как использование CDN и сокращение подресурсов, блокирующих рендеринг. После реализации следуйте этим рекомендациям , чтобы максимизировать преимущества LCP от предварительной выборки SXG. Во многих случаях такая оптимизация может привести к почти мгновенной загрузке страниц из поиска Google:
Влияние подписанных бирж
В ходе прошлых экспериментов мы наблюдали снижение LCP в среднем на 300–400 мс при предварительной выборке с поддержкой SXG. Это помогает сайтам произвести лучшее первое впечатление на пользователей и часто положительно влияет на бизнес-показатели.
Несколько мировых брендов и сайтов уже воспользовались преимуществами подписанных бирж. В качестве примера давайте посмотрим, как внедрение Signed Exchanges помогло RebelMouse , известной системе управления контентом (CMS), улучшить производительность и бизнес-показатели своих клиентов:
- Narcity улучшил LCP на 41 %
- Журнал Paper Magazine заметил увеличение количества сеансов на пользователя на 27 %.
- Блог MLT уменьшил время загрузки страницы на 21%
Cloudflare обнаружила , что SXG улучшил TTFB для 98% протестированных ею сайтов и улучшил LCP для 85% сайтов , при этом медианное улучшение загрузки страниц, соответствующих требованиям SXG, составило более 20%.
Индексирование
Представления страницы в формате SXG и не в формате SXG не ранжируются и не индексируются Google Search по-разному. SXG, в конечном счете, является механизмом доставки — он не меняет базовый контент.
AMP
Контент AMP можно доставлять с помощью SXG. SXG позволяет предварительно загружать и отображать контент AMP, используя его канонический URL-адрес, а не URL-адрес AMP. AMP имеет собственный отдельный инструмент для создания SXG. Узнайте, как обслуживать AMP с помощью подписанных обменов на amp.dev .
Отладка SXG с помощью Chrome DevTools
Чтобы увидеть SXG своими глазами, используйте браузер Chromium, откройте DevTools, откройте панель «Сеть» и посетите этот пример страницы поиска . Подписанные обмены можно определить, найдя signed-exchange
в столбце «Тип» .
![Снимок экрана, показывающий запрос SXG на панели «Сеть» в DevTools.](https://web.dev/static/articles/signed-exchanges/image/screenshot-showing-sxg-r-9a4f9df2440b3.png?authuser=7&hl=ru)
Вкладка «Предварительный просмотр» предоставляет дополнительную информацию о содержимом SXG.
![Снимок экрана: вкладка «Предварительный просмотр» для SXG.](https://web.dev/static/articles/signed-exchanges/image/screenshot-the-preview-033e1253a3e1.png?authuser=7&hl=ru)
Оснастка
Реализация SXG заключается в создании SXG, соответствующего заданному URL-адресу, и последующей передаче этого SXG запрашивающим сторонам (обычно сканерам).
Сертификаты
Для создания SXG вам понадобится сертификат, который может подписывать SXG, хотя некоторые инструменты получают его автоматически. На этой странице перечислены центры сертификации, которые могут выдавать сертификаты этого типа. Сертификаты можно получить автоматически в центре сертификации Google с помощью любого клиента ACME. Web Packager Server имеет встроенный клиент ACME, и скоро он появится в sxg-rs.
Инструменты SXG для конкретной платформы
Эти инструменты поддерживают определенные стеки технологий. Если вы уже используете платформу, поддерживаемую одним из этих инструментов, возможно, вам будет проще настроить ее, чем инструмент общего назначения.
sxg-rs/cloudflare_worker
работает на Cloudflare Workers .sxg-rs/fastly_compute
работает на Fastly Compute@Edge .Автоматические подписанные обмены — это функция Cloudflare, которая автоматически получает сертификаты и создает подписанные обмены.
Модуль NGINX SXG генерирует и обслуживает SXG для сайтов, использующих nginx . Инструкцию по настройке можно найти здесь .
Envoy SXG Filter генерирует и обслуживает SXG для сайтов, использующих Envoy .
Инструмент SXG общего назначения
HTTP-сервер sxg-rs
http_server sxg-rs действует как обратный прокси-сервер для обслуживания SXG. Для запросов от сканеров SXG http_server
будет подписывать ответы от серверной части и отвечать SXG. Инструкции по установке см. в README .
Веб-сервер упаковщика
Сервер веб-упаковщика , webpkgserver
, является альтернативой http_server sxg-rs, написанной на Go. Инструкции по настройке сервера Web Packager см. в разделе «Как настроить подписанные обмены с помощью Web Packager» .
Интерфейс командной строки веб-упаковщика
Интерфейс командной строки Web Packager генерирует SXG, соответствующий заданному URL-адресу.
webpackager \
--private\_key=private.key \
--cert\_url=https://example.com/certificate.cbor \
--url=https://example.com
После создания файла SXG загрузите его на свой сервер и отправьте его с типом MIME application/signed-exchange;v=b3
. Кроме того, вам нужно будет предоставить сертификат SXG как application/cert-chain+cbor
.
SXG-библиотеки
Эти библиотеки можно использовать для создания собственного генератора SXG:
sxg_rs
— это библиотека Rust для создания SXG. Это наиболее функциональная библиотека SXG, которая используется в качестве основы для инструментовcloudflare_worker
иfastly_compute
.libsxg
— это минимальная библиотека C для создания SXG. Он используется в качестве основы для модуля NGINX SXG и фильтра Envoy SXG.go/signed-exchange
— это минимальная библиотека Go, предоставляемая спецификацией веб-пакета в качестве эталонной реализации генерации SXG. Он используется в качестве основы для эталонного инструмента CLI,gen-signedexchange
и более функциональных инструментов Web Packager.
Согласование содержания
Серверы должны обслуживать SXG, когда заголовок Accept указывает, что значение q для application/signed-exchange больше или равно значению q для text/html. На практике это означает, что исходный сервер будет предоставлять SXG сканерам, но не браузерам. Многие из вышеперечисленных инструментов делают это по умолчанию, но для других инструментов можно использовать следующее регулярное выражение для сопоставления заголовка Accept запросов, которые должны обслуживаться как SXG: http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/
Эта рекомендация включает примеры для Apache и nginx.
Обновить API кэша
У Google SXG Cache есть 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 вашего сайта.
- SXG также предварительно выбирает подресурсы для ваших страниц, такие как JavaScript, CSS, шрифты и изображения, если они указаны с использованием заголовка
Link
. - В ближайшем будущем предварительная загрузка SXG из Google Search будет доступна для большего количества типов результатов поиска.
Заключение
Подписанные обмены — это механизм доставки, который позволяет проверять происхождение и достоверность ресурса независимо от того, как ресурс был доставлен. В результате файлы SXG могут распространяться третьими сторонами, сохраняя при этом полную атрибуцию издателя.