Signed Exchange (SXG)

Uno SXG è un meccanismo di consegna che permette di autenticare di una risorsa, indipendentemente da come è stata distribuita.

Katie Hempenius
Katie Hempenius
Devin Mullins
Devin Mullins

Gli scambi firmati (SXG) sono un meccanismo di consegna che consente di autenticare l'origine di una risorsa indipendentemente dal modo in cui è stata pubblicata. L'implementazione di SXG può migliorare la metrica Largest Contentful Paint (LCP) attivando il precaricamento multiorigine per la tutela della privacy. Inoltre, questo disaccoppiamento favorisce una varietà di casi d'uso, come le esperienze su internet offline e la pubblicazione da cache di terze parti.

Questo articolo fornisce una panoramica completa di SXG: come funziona, casi d'uso e strumenti.

Compatibilità del browser

SXG è supportato dai browser basati su Chromium (a partire dalle versioni: Chrome 73, Edge 79 e Opera 64).

Panoramica

Come caso d'uso principale, SXG utilizza una cache per precaricare e pubblicare contenuti che sono stati firmati tramite crittografia dall'origine. Ciò consente di velocizzare le navigazioni tra origini dai siti referer, garantendo al contempo che le pagine rimangano inalterate e vengano correttamente attribuite alla loro origine. Tutte le informazioni potenzialmente identificative rimangono nascoste fino a quando l'utente non accede a un sito proteggendo così la sua privacy. La Ricerca Google è tra i primi utenti ad adottare le funzionalità di precaricamento SXG e, per i siti che ricevono una gran parte del traffico dalla Ricerca Google, SXG può essere uno strumento importante per offrire agli utenti caricamenti più rapidi delle pagine. Nel corso del tempo, ci auguriamo che questo impatto venga esteso ad altri referrer.

Come funziona

Un sito firma una coppia richiesta/risposta (uno "scambio HTTP") in modo da consentire il browser per verificare l'origine e l'integrità dei contenuti, indipendentemente come sono stati distribuiti i contenuti. Di conseguenza, il browser può visualizzare l'URL di il sito di origine nella barra degli indirizzi, anziché l'URL del server che ha pubblicato i contenuti.

Diagramma che spiega il funzionamento di Signed Exchange. Browser che comunica con la cache che comunica con il sito di destinazione

Storicamente, l'unico modo per utilizzare una terza parte per distribuire i suoi contenuti mantenendo al contempo l'attribuzione è stata la condivisione dei certificati SSL da parte del sito distributore. Questo presenta svantaggi in termini di sicurezza; Inoltre, è molto distante per rendere i contenuti davvero portabili.

Il formato SXG

Un SXG è incapsulato in un file con codifica binaria che contiene principali: uno scambio HTTP e un firma che copre lo scambio. Lo scambio HTTP è costituito da un URL di richiesta, contenuti informazioni sulla negoziazione e una risposta HTTP.

Di seguito è riportato un esempio di file SXG decodificato.

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>

Il parametro expires nella firma indica la data di scadenza di un SXG. R SXG può essere valido per un massimo di 7 giorni. Puoi trovare ulteriori informazioni su L'intestazione della firma nel documento Signed HTTP Exchanges del modello.

Supporto per la personalizzazione lato server

Un annuncio SXG contenente un'intestazione Vary: Cookie verrà mostrato solo agli utenti che non contengono cookie per l'URL della richiesta firmata. Se il sito presenta codice HTML diverso agli utenti che hanno eseguito l'accesso, puoi utilizzare questa funzione per sfruttare i vantaggi SXG senza alterare l'esperienza. Visualizza i dettagli sulla personalizzazione lato server con Dynamic SXG.

Web Packaging

SXG fa parte della più ampia piattaforma Web Famiglia di proposte di specifiche per la pacchettizzazione. Inoltre, Per gli SXG, l'altro componente principale delle specifiche di Web Packaging sono i Web Bundle ("scambi HTTP in bundle"). I web bundle sono una raccolta di risorse HTTP i metadati necessari per interpretare il bundle.

La relazione tra SXG e Web Bundle è un punto di confusione comune. SXG e Web Bundle sono due tecnologie distinte che non dipendono altro: i web bundle possono essere utilizzati sia con piattaforme di scambio pubblicitario con firma che con piattaforme non firmate. Un comune l'obiettivo avanzato sia da SXG che da Web Bundle è la creazione di un "pacchetto web" che consente di condividere i siti nella loro interezza per il consumo offline.

Accelerare il caricamento delle pagine con le piattaforme di scambio firmate

L'attivazione di Signed Exchange può contribuire a velocizzare le prestazioni delle pagine web e, di conseguenza, avere un impatto sui Core Web Vitals del tuo sito, in particolare Largest Contentful Paint (LCP). Tra gli early adopter, la Ricerca Google utilizza SXG per offrire agli utenti un'esperienza di caricamento delle pagine più rapida per le pagine caricate dalla pagina dei risultati di ricerca.

La Ricerca Google esegue la scansione e memorizza nella cache gli SXG, se disponibili, e precarica gli SXG che è probabile che l'utente visiti, ad esempio la pagina corrispondente al primo risultato di ricerca.

SXG funziona al meglio insieme ad altre ottimizzazioni delle prestazioni, come l'uso di CDN e la riduzione delle sottorisorse che bloccano la visualizzazione. Dopo l'implementazione, segui questi consigli per massimizzare i vantaggi dell'LCP derivanti dal precaricamento degli SXG. In molti casi, questa ottimizzazione può comportare caricamenti di pagine quasi istantanei provenienti dalla Ricerca Google:

Impatto delle piattaforme di scambio firmate

Dagli esperimenti passati abbiamo osservato una riduzione media di 300-400 ms nell'LCP a causa dei precaricamenti abilitati per SXG. Ciò consente ai siti di fare una prima impressione migliore sugli utenti e spesso ha un impatto positivo sulle metriche aziendali.

Diversi brand e siti globali hanno già usufruito di Signed Exchange. Come case study, vediamo come l'implementazione di Signed Exchange ha aiutato RebelMouse, un importante sistema di gestione dei contenuti (CMS), a migliorare i metriche sul rendimento e sull'attività:

  • Narcity ha migliorato l'LCP del 41%
  • Paper Magazine ha notato un aumento del 27% delle sessioni per utente
  • Il blog MLT ha ridotto il tempo di caricamento della pagina del 21%

Cloudflare ha rilevato che SXG ha migliorato il TTFB per il 98% dei siti testato e l'LCP per l'85% dei siti, con un miglioramento mediano di oltre il 20% nei caricamenti delle pagine idonei per SXG.

Indicizzazione

Le rappresentazioni SXG e non SXG di una pagina non vengono classificate o indicizzate in modo diverso dalla Ricerca Google. SXG è in ultima analisi un meccanismo di consegna, non modificare i contenuti sottostanti.

AMP

I contenuti AMP possono essere pubblicati tramite SXG. SXG consente il precaricamento dei contenuti AMP e visualizzato utilizzando il proprio URL canonico, anziché il suo URL AMP.AMP ha un proprio strumenti per la generazione di SXG.Scopri come pubblicare pagine AMP utilizzando Signed Exchange amp.dev.

Debug di SXG con Chrome DevTools

Per visualizzare un SXG in prima persona, usa un browser Chromium, apri DevTools, apri il riquadro Rete e visita questa pagina di ricerca di esempio. Le piattaforme di scambio firmate possono essere identificate cercando signed-exchange nella colonna Type (Tipo).

Screenshot che mostra una richiesta SXG all&#39;interno della &quot;Rete&quot; in DevTools
Riquadro Rete in DevTools

La scheda Anteprima fornisce ulteriori informazioni sui contenuti di un SXG.

Screenshot di &quot;Anteprima&quot; per SXG
La scheda Anteprima in DevTools

Utensili

L'implementazione di SXG consiste nel generare lo scambio SXG corrispondente a un determinato URL e quindi pubblicare questo SXG ai richiedenti (di solito i crawler).

Certificati

Per generare un SXG è necessario un certificato che possa firmare SXG, anche se alcuni strumenti li acquisiscono automaticamente. Questa pagina elenca le autorità di certificazione che possono emettere questo tipo di certificato. I certificati possono essere ottenuti automaticamente dall'autorità di certificazione di Google utilizzando qualsiasi client ACME. Web Packager Server ha un client ACME integrato e a breve sxg-rs lo farà.

Strumenti SXG specifici per piattaforma

Questi strumenti supportano stack tecnologici specifici. Se utilizzi già una supportata da uno di questi strumenti, potrebbe essere più facile da configurare rispetto uno strumento per uso generico.

Strumenti SXG per uso generico

Server HTTP sxg-rs

Lo sxg-rs http_server agisce da proxy inverso per per la gestione di SXG. Per le richieste dei crawler SXG, http_server firmerà la dal backend e risponde con un SXG. Per l'installazione istruzioni, consulta LEGGIMI.

Server Web Packager

Web Packager di sicurezza, webpkgserver è un'alternativa a sxg-rs http_server, scritta in Go. Per istruzioni sulla configurazione del server Web Packager, consulta Come configurare tramite Web Packager.

Interfaccia a riga di comando Web Packager

L'interfaccia a riga di comando Web Packager genera un file SXG corrispondenti a un determinato URL.

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

Una volta generato il file SXG, caricalo sul server e invialo con il tipo MIME application/signed-exchange;v=b3. Inoltre, dovrai pubblicare il certificato SXG come application/cert-chain+cbor.

Librerie SXG

Queste librerie potrebbero essere utilizzate per creare il tuo generatore SXG:

  • sxg_rs è una libreria Rust per per generare SXG. È la libreria SXG più ricca di funzionalità ed è utilizzata come per gli strumenti cloudflare_worker e fastly_compute.

  • libsxg è una libreria C minima per per generare SXG. È utilizzato come base per il modulo NGINX SXG e Filtro Envoy SXG.

  • go/signed-exchange è una libreria Go minima fornita dalla specifica webpackage come riferimento dell'implementazione per generare SXG. È utilizzato come base per il suo strumento di interfaccia a riga di comando di riferimento, gen-signedexchange e gli strumenti Web Packager, sempre più funzionalità.

Negoziazione dei contenuti

I server devono pubblicare SXG quando l'intestazione Accept indica che il valore q per application/Signed-Exchange è maggiore o uguale al q-value per text/html. In pratica, ciò significa che un server di origine fornirà SXG ai crawler, ma non ai browser. Molti degli strumenti sopra citati eseguono questa operazione per impostazione predefinita, ma per altri strumenti è possibile utilizzare la seguente espressione regolare per trovare la corrispondenza con l'intestazione Accept delle richieste che devono essere gestite come SXG: http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/

Questo suggerimento include esempi per Apache e nginx.

Update Cache API

Google SXG Cache dispone di un'API che i proprietari dei siti possono utilizzare per rimuovere gli SXG dalla cache prima che scadano per Cache-Control: max-age. Per informazioni dettagliate, consulta il riferimento API Update Cache.

Collegamento a SXG

Qualsiasi sito può memorizzare nella cache, pubblicare e precaricare le pagine SXG delle pagine a cui rimanda, se disponibili, utilizzando i tag e : html <a href="https://example.com/article.html.sxg"> <link rel="prefetch" as="document" href="https://example.com/article.html.sxg"> Questo articolo illustra come utilizzare nginx per distribuire gli SXG.

Vantaggi unici

SXG è una delle numerose tecnologie possibili per abilitare il precaricamento multiorigine. Nel decidere quale tecnologia utilizzare, potrebbe essere necessario trovare un compromesso tra l'ottimizzazione di aspetti diversi. Le seguenti sezioni illustrano alcuni dei valori univoci forniti da SXG nell'ambito delle possibili soluzioni. Questi fattori possono cambiare nel tempo man mano che lo spazio delle soluzioni disponibili si evolve.

Meno richieste di pubblicazione

Con il precaricamento tra siti, il server potrebbe dover gestire richieste aggiuntive. Questo corrisponde ai casi in cui una pagina è stata precaricata, ma l'utente non l'ha visitata oppure i byte precaricati non sono stati mostrati all'utente. Per SXG, le seguenti richieste aggiuntive inutilizzate possono essere ridotte notevolmente:

  • Gli SXG vengono memorizzati nella cache e possono essere inviati agli utenti fino alla loro scadenza. Pertanto, molti precaricamenti possono essere gestiti esclusivamente dal server di cache.
  • Gli SXG possono essere mostrati agli utenti sia con che senza cookie sul tuo sito. Di conseguenza, ci saranno meno volte in cui la pagina dovrà essere recuperata di nuovo dopo la navigazione.

Miglioramento della velocità delle pagine

Potresti notare ulteriori miglioramenti della velocità delle pagine a causa delle piattaforme e delle funzionalità di precaricamento attualmente supportate:

  • Gli SXG possono essere mostrati agli utenti con cookie per il tuo sito.
  • Inoltre, SXG precarica le sottorisorse per le pagine, come JavaScript, CSS, caratteri e immagini, se specificate utilizzando un'intestazione Link.
  • A breve il precaricamento SXG dalla Ricerca Google sarà disponibile per più tipi di risultati di ricerca.

Conclusione

Signed Exchange è un meccanismo di consegna che consente di verificare origine e validità di una risorsa, indipendentemente da come sono recapitate. Di conseguenza, gli SXG possono essere distribuiti da terze parti mantenere l'attribuzione completa del publisher.

Per approfondire