Signed Exchange (SXG)

SXG to mechanizm dostarczania, który umożliwia uwierzytelnianie pochodzenia zasobu niezależnie od sposobu jego dostarczenia.

Katie Hempenius
Katie Hempenius
Devin Mullins
Devin Mullins

Podpisane wymiany (SXG) to mechanizm dostarczania, który umożliwia uwierzytelnianie źródła zasobu niezależnie od sposobu jego dostarczenia. Wdrożenie SXG może poprawić największe wyrenderowanie treści (LCP) dzięki włączeniu pobierania z wyprzedzeniem z różnych źródeł z zachowaniem prywatności. Dodatkowo takie rozdzielenie umożliwia realizację różnych przypadków użycia, takich jak korzystanie z internetu w trybie offline i wyświetlanie treści z pamięci podręcznych innych firm.

Z tego artykułu dowiesz się wszystkiego o SXG: jak działa, jakie są przypadki użycia i narzędzia.

Zgodność z przeglądarką

SXG jest obsługiwany przez przeglądarki oparte na Chromium (od wersji Chrome 73, Edge 79 i Opera 64).

Przegląd

W podstawowym przypadku użycia SXG wykorzystuje pamięć podręczną do pobierania z wyprzedzeniem i wyświetlania treści, które zostały podpisane kryptograficznie przez źródło. Pomaga to przyspieszyć nawigację między różnymi domenami z witryn odsyłających, a jednocześnie zapewnia, że strony pozostają niezmienione i są prawidłowo przypisane do ich źródła. Wszelkie informacje umożliwiające identyfikację są ukryte, dopóki użytkownik nie przejdzie do witryny, co chroni jego prywatność. Wyszukiwarka Google jest jednym z pierwszych użytkowników wczesnej wersji funkcji pobierania wstępnego SXG. W przypadku witryn, które otrzymują dużą część ruchu z wyszukiwarki Google, SXG może być ważnym narzędziem do szybszego wczytywania stron. Mamy nadzieję, że z czasem ten wpływ rozszerzy się na dodatkowe źródła odesłań.

Jak to działa

Witryna podpisuje parę żądanie/odpowiedź („wymiana HTTP”) w sposób, który umożliwia przeglądarce zweryfikowanie pochodzenia i integralności treści niezależnie od sposobu ich rozpowszechniania. Dzięki temu przeglądarka może wyświetlać na pasku adresu URL witryny źródłowej, a nie URL serwera, który dostarczył treść.

Diagram wyjaśniający, jak działają podpisane wymiany. Przeglądarka komunikuje się z pamięcią podręczną, która komunikuje się z witryną docelową

Wcześniej jedynym sposobem na to, aby witryna mogła korzystać z usług firmy zewnętrznej do rozpowszechniania treści przy zachowaniu atrybucji, było udostępnienie dystrybutorowi certyfikatów SSL. Ma to wady związane z bezpieczeństwem, a ponadto nie zapewnia prawdziwej przenośności treści.

Format SXG

SXG jest umieszczany w pliku zakodowanym binarnie, który składa się z 2 głównych komponentów: wymiany HTTP i podpisu, który obejmuje wymianę. Wymiana HTTP obejmuje adres URL żądania, informacje o negocjacji zawartości i odpowiedź HTTP.

Oto przykład zdekodowanego pliku 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>

Parametr expires w podpisie wskazuje datę ważności SXG. SXG może być ważny maksymalnie przez 7 dni. Więcej informacji o nagłówku podpisu znajdziesz w specyfikacji podpisanej wymiany HTTP.

Obsługa personalizacji po stronie serwera

Plik SXG zawierający nagłówek Vary: Cookie będzie wyświetlany tylko użytkownikom, którzy nie mają plików cookie dla adresu URL podpisanego żądania. Jeśli Twoja witryna wyświetla zalogowanym użytkownikom inny kod HTML, możesz użyć tej funkcji, aby korzystać z SXG bez zmiany tego sposobu działania. Zobacz szczegółowe informacje o personalizacji po stronie serwera za pomocą dynamicznych pakietów SXG.

Web Packaging

SXG należy do szerszej rodziny propozycji specyfikacji Web Packaging. Oprócz SXG drugim ważnym elementem specyfikacji Web Packaging są pakiety internetowe („pakiety wymiany HTTP”). Pakiety internetowe to zbiór zasobów HTTP i metadanych niezbędnych do interpretacji pakietu.

Związek między SXG a pakietami internetowymi jest częstym źródłem nieporozumień. SXG i pakiety internetowe to 2 różne technologie, które nie są od siebie zależne – pakietów internetowych można używać zarówno z podpisanymi, jak i niepodpisanymi wymianami. Wspólnym celem SXG i pakietów internetowych jest utworzenie formatu „pakietu internetowego”, który umożliwia udostępnianie całych witryn do użytku offline.

Przyspieszanie wczytywania stron dzięki technologii Signed Exchange

Włączenie (technologii) Signed Exchange może przyspieszyć wydajność stron internetowych, a tym samym wpłynąć na Core Web Vitals witryny, w szczególności na największe wyrenderowanie treści (LCP). Wyszukiwarka Google jako użytkownik wczesnej wersji używa SXG, aby zapewnić użytkownikom szybsze wczytywanie stron ze strony wyników wyszukiwania.

Wyszukiwarka Google indeksuje i zapisuje w pamięci podręcznej pliki SXG, gdy są dostępne, oraz pobiera z wyprzedzeniem pliki SXG, które użytkownik prawdopodobnie odwiedzi, np. stronę odpowiadającą pierwszemu wynikowi wyszukiwania.

SXG działa najlepiej w połączeniu z innymi optymalizacjami wydajności, takimi jak korzystanie z sieci CDN i ograniczanie zasobów podrzędnych blokujących renderowanie. Po wdrożeniu postępuj zgodnie z tymi zaleceniami, aby zmaksymalizować korzyści związane z LCP wynikające z pobierania z wyprzedzeniem plików SXG. W wielu przypadkach taka optymalizacja może spowodować niemal natychmiastowe wczytywanie stron z wyszukiwarki Google:

Wpływ technologii Signed Exchange

Z poprzednich eksperymentów wynika, że wstępne pobieranie z włączoną obsługą SXG pozwala skrócić LCP średnio o 300–400 ms. Dzięki temu witryny robią lepsze pierwsze wrażenie na użytkownikach, co często ma pozytywny wpływ na dane biznesowe.

Kilka globalnych marek i witryn już korzysta z podpisanych wymian. W ramach studium przypadku przyjrzyjmy się, jak wdrożenie podpisanych wymian pomogło firmie RebelMouse, która jest znanym dostawcą systemu zarządzania treścią (CMS), poprawić wyniki i wskaźniki biznesowe jej klientów:

  • Narcity poprawiło LCP o 41%
  • W Paper Magazine odnotowano wzrost liczby sesji na użytkownika o 27%.
  • MLT Blog skrócił czas wczytywania strony o 21%

Cloudflare wykazało, że SXG poprawiło TTFB w przypadku 98% przetestowanych witryn i poprawiło LCP w przypadku 85% witryn, przy czym mediana poprawy wyniosła ponad 20% w przypadku wczytywania stron kwalifikujących się do SXG.

Indeksowanie

Wyszukiwarka Google nie indeksuje ani nie ocenia inaczej stron w formacie SXG i w innych formatach. SXG to ostatecznie mechanizm dostarczania – nie zmienia on treści.

AMP

Treści AMP można dostarczać za pomocą SXG. SXG umożliwia wstępne pobieranie treści AMP i wyświetlanie ich przy użyciu kanonicznego adresu URL, a nie adresu URL AMP.AMP ma własne oddzielne narzędzia do generowania SXG.Dowiedz się, jak wyświetlać strony AMP za pomocą Signed Exchange, na stronie amp.dev.

Debugowanie SXG za pomocą Narzędzi deweloperskich w Chrome

Aby zobaczyć SXG, użyj przeglądarki Chromium, otwórz Narzędzia deweloperskie, otwórz panel Sieć i odwiedź tę przykładową stronę wyszukiwania. Podpisane wymiany można rozpoznać po wartości signed-exchange w kolumnie Typ.

Zrzut ekranu przedstawiający żądanie SXG w panelu „Sieć” w Narzędziach deweloperskich
Panel Sieć w Narzędziach deweloperskich

Na karcie Podgląd znajdziesz więcej informacji o zawartości pliku SXG.

Zrzut ekranu karty „Podgląd” dla SXG
Karta Podgląd w Narzędziach deweloperskich

Narzędzia

Wdrażanie SXG polega na wygenerowaniu SXG odpowiadającego danemu adresowi URL, a następnie udostępnieniu go osobom wysyłającym żądania (zwykle robotom).

Certyfikaty

Aby wygenerować SXG, potrzebujesz certyfikatu, który może podpisywać SXG, chociaż niektóre narzędzia uzyskują je automatycznie. Na tej stronie znajdziesz listę urzędów certyfikacji, które mogą wystawiać tego typu certyfikaty. Certyfikaty można uzyskać automatycznie z urzędu certyfikacji Google za pomocą dowolnego klienta ACME. Web Packager Server ma wbudowanego klienta ACME, a sxg-rs będzie go mieć wkrótce.

Narzędzia SXG dla konkretnych platform

Te narzędzia obsługują określone stosy technologiczne. Jeśli korzystasz już z platformy obsługiwanej przez jedno z tych narzędzi, konfiguracja może być łatwiejsza niż w przypadku narzędzia do zwykłych obciążeń.

Narzędzia SXG do zwykłych obciążeń

Serwer HTTP sxg-rs

sxg-rs http_server działa jako odwrotny serwer proxy do obsługi SXG. W przypadku żądań od robotów SXG http_server podpisze odpowiedzi z backendu i odpowie za pomocą SXG. Instrukcje instalacji znajdziesz w pliku README.

Serwer Web Packager

Web Packager Server, webpkgserver, to alternatywa dla sxg-rs http_server, napisana w Go. Instrukcje konfigurowania serwera Web Packager znajdziesz w artykule How to set up signed exchanges using Web Packager (Jak skonfigurować podpisane wymiany za pomocą Web Packagera).

Interfejs wiersza poleceń Web Packager

Interfejs wiersza poleceń Web Packager generuje SXG odpowiadający danemu adresowi URL.

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

Po wygenerowaniu pliku SXG prześlij go na serwer i udostępnij z typem MIME application/signed-exchange;v=b3. Dodatkowo musisz udostępniać certyfikat SXG jako application/cert-chain+cbor.

Biblioteki SXG

Te biblioteki mogą służyć do tworzenia własnego generatora SXG:

  • sxg_rs to biblioteka Rust do generowania SXG. Jest to najbardziej rozbudowana biblioteka SXG, która stanowi podstawę narzędzi cloudflare_worker i fastly_compute.

  • libsxg to minimalna biblioteka C do generowania SXG. Jest on używany jako podstawa modułu NGINX SXG i filtra Envoy SXG.

  • go/signed-exchange to minimalna biblioteka Go udostępniana przez specyfikację pakietu internetowego jako implementacja referencyjna generowania SXG. Jest on używany jako podstawa narzędzia wiersza poleceń gen-signedexchange i bardziej rozbudowanych narzędzi Web Packager.

Negocjowanie treści

Serwery powinny wyświetlać SXG, gdy nagłówek Accept wskazuje, że wartość q dla application/signed-exchange jest większa lub równa wartości q dla text/html. W praktyce oznacza to, że serwer pierwotny będzie udostępniać SXG robotom, ale nie przeglądarkom. Wiele z powyższych narzędzi robi to domyślnie, ale w przypadku innych narzędzi można użyć tego wyrażenia regularnego, aby dopasować nagłówek Accept żądań, które powinny być obsługiwane jako SXG: http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/

Ta rekomendacja zawiera przykłady dla serwerów Apache i nginx.

Interfejs API aktualizacji pamięci podręcznej

Pamięć podręczna SXG Google ma interfejs API, którego właściciele witryn mogą używać do usuwania plików SXG z pamięci podręcznej, zanim wygasną z powodu Cache-Control: max-age. Więcej informacji znajdziesz w dokumentacji interfejsu API do aktualizowania pamięci podręcznej.

Linki do SXG

Każda witryna może zapisywać w pamięci podręcznej, wyświetlać i pobierać z wyprzedzeniem pliki SXG stron, do których prowadzą linki, jeśli są dostępne, za pomocą tagów i  : html <a href="https://example.com/article.html.sxg"> <link rel="prefetch" as="document" href="https://example.com/article.html.sxg"> Ten artykuł pokazuje, jak używać nginx do dystrybucji plików SXG.

Wyjątkowe zalety

SXG to jedna z wielu technologii umożliwiających wstępne pobieranie zasobów ze współdzielonych domen. Wybierając technologię, musisz zdecydować, które aspekty chcesz zoptymalizować. W sekcjach poniżej przedstawiamy kilka unikalnych wartości, które SXG zapewnia w zakresie możliwych rozwiązań. Te czynniki mogą się zmieniać w miarę rozwoju dostępnych rozwiązań.

Mniej żądań do obsłużenia

W przypadku pobierania wstępnego między witrynami serwer może być zmuszony do obsługi dodatkowych żądań. Dotyczy to przypadków, gdy strona została pobrana z wyprzedzeniem, ale użytkownik jej nie odwiedził lub nie można było wyświetlić mu pobranych z wyprzedzeniem bajtów. W przypadku SXG te dodatkowe nieużywane żądania można znacznie ograniczyć:

  • Pliki SXG są przechowywane w pamięci podręcznej i mogą być wysyłane do użytkowników, dopóki nie wygasną. Dzięki temu wiele żądań pobierania wstępnego może być obsługiwanych wyłącznie przez serwer pamięci podręcznej.
  • Pliki SXG mogą być wyświetlane użytkownikom, którzy mają pliki cookie Twojej witryny, oraz tym, którzy ich nie mają. Dzięki temu strona będzie rzadziej pobierana ponownie po nawigacji.

Poprawa Page Speed

Możesz zauważyć dodatkową poprawę szybkości strony dzięki obsługiwanym obecnie platformom i funkcjom pobierania wstępnego:

  • Pliki SXG mogą być wyświetlane użytkownikom, którzy mają pliki cookie Twojej witryny.
  • SXG pobiera też wstępnie zasoby podrzędne stron, takie jak JavaScript, CSS, czcionki i obrazy, jeśli zostały określone za pomocą nagłówka Link.
  • W najbliższej przyszłości pobieranie wstępne SXG z wyszukiwarki Google będzie dostępne w przypadku większej liczby typów wyników wyszukiwania.

Podsumowanie

Podpisane wymiany to mechanizm dostarczania, który umożliwia weryfikację pochodzenia i ważności zasobu niezależnie od sposobu jego dostarczenia. Dzięki temu pakiety SXG mogą być rozpowszechniane przez inne firmy, zachowując pełne informacje o wydawcy.

Więcej informacji