Signed Exchange (SXG)

Un SXG è un meccanismo di importazione che consente di autenticare l'origine di una risorsa indipendentemente dal modo in cui è stata importata.

Katie Hempenius
Katie Hempenius
X
Devin Mullins
Devin Mullins
X GitHub

Gli scambi firmati (SXG) sono un meccanismo di pubblicazione che consente di autenticare l'origine di una risorsa indipendentemente dal modo in cui è stata pubblicata. L'implementazione di SXG può migliorare il Largest Contentful Paint (LCP) attivando il precaricamento cross-origin che garantisce la tutela della privacy. Inoltre, questo disaccoppiamento consente di migliorare una serie di casi d'uso, come le esperienze di 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 firmati criptograficamente dall'origine. In questo modo, è possibile velocizzare le navigazioni tra origini dai siti di referrer, garantendo al contempo che le pagine rimangano inalterate e attribuite correttamente alla loro origine. Eventuali informazioni che potrebbero consentire l'identificazione vengono nascoste fino a quando l'utente non accede a un sito, proteggendo così la sua privacy. La Ricerca Google è tra i primi ad adottare le funzionalità di precaricamento SXG e, per i siti che ricevono una grande parte del traffico dalla Ricerca Google, SXG può essere uno strumento importante per offrire agli utenti caricamenti di pagine più rapidi. Nel tempo, ci auguriamo che questo impatto si estenda ad altri referrer.

Come funziona

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

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

In passato, l'unico modo per un sito di utilizzare una terza parte per distribuire i suoi contenuti mantenendo l'attribuzione era condividere i suoi certificati SSL con il distributore. Questo presenta svantaggi in termini di sicurezza; inoltre, è molto lontano dal rendere i contenuti veramente portatili.

Il formato SXG

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

Ecco 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. Un SXG può essere valido per un massimo di 7 giorni. Puoi trovare maggiori informazioni sull'intestazione della firma nella specifica per gli scambi HTTP firmati.

Supporto della personalizzazione lato server

Uno SXG contenente un'intestazione Vary: Cookie verrà mostrato solo agli utenti che non hanno cookie per l'URL della richiesta firmata. Se il tuo sito presenta HTML diverso per gli utenti che hanno eseguito l'accesso, puoi utilizzare questa funzionalità per sfruttare gli SXG senza alterare l'esperienza. Consulta i dettagli sulla personalizzazione lato server con SXG dinamici.

Pacchettizzazione web

SXG fa parte della famiglia più ampia di proposte di specifiche Web Packaging. Oltre agli SXG, l'altro componente principale delle specifiche di imballaggio web è costituito dai bundle web ("piattaforme di scambio pubblicitario HTTP raggruppate"). I bundle web sono una raccolta di risorse HTTP e dei metadati necessari per interpretare il bundle.

La relazione tra gli SXG e i pacchetti web è un punto di confusione comune. SXG e Web Bundle sono due tecnologie distinte che non dipendono l'una dall'altra: i Web Bundle possono essere utilizzati sia con le piattaforme di scambio pubblicitario con firma che senza firma. Un obiettivo comune proposto sia dagli SXG sia dai pacchetti web è la creazione di un formato "web packaging" che consenta di condividere i siti nella loro interezza per la fruizione offline.

Accelerare i caricamenti di pagine con gli scambi firmati

L'attivazione degli scambi firmati può contribuire ad accelerare il rendimento delle pagine web e quindi influire sui Core Web Vitals del tuo sito, in particolare sulla visualizzazione elemento più grande (LCP). In qualità di 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 l'utente è probabile che visiti, ad esempio la pagina corrispondente al primo risultato di ricerca.

SXG funziona al meglio in combinazione con altre ottimizzazioni delle prestazioni, come l'utilizzo di CDN e la riduzione delle risorse secondarie che bloccano il rendering. Dopo l'implementazione, segui questi consigli per massimizzare il vantaggio LCP del pre-caricamento degli SXG. In molti casi, questa ottimizzazione può comportare caricamenti di pagine quasi istantanei provenienti dalla Ricerca Google:

Impatto delle piattaforme di scambio pubblicitario con firma

Da esperimenti precedenti abbiamo osservato una riduzione media di 300-400 ms del LCP dai precaricamenti abilitati per SXG. In questo modo, i siti fanno una prima impressione migliore sugli utenti e spesso hanno un impatto positivo sulle metriche aziendali.

Diversi brand e siti globali hanno già tratto vantaggio dagli scambi firmati. Come case study, vediamo in che modo l'implementazione di Signed Exchanges ha aiutato RebelMouse, un importante sistema di gestione dei contenuti (CMS), a migliorare il rendimento e le metriche aziendali dei propri clienti:

  • Narcity ha migliorato il valore LCP del 41%
  • Paper Magazine ha registrato 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 testati e ha migliorato l'LCP per l'85% dei siti, con un miglioramento medio di oltre il 20% nei caricamenti di pagine idonei per SXG.

Indicizzazione

Le rappresentazioni SXG e non SXG di una pagina non vengono classificate o indicizzate diversamente dalla Ricerca Google. SXG è in definitiva un meccanismo di pubblicazione, non modifica i contenuti sottostanti.

AMP

I contenuti AMP possono essere pubblicati utilizzando SXG. SXG consente di eseguire il prelievo dei contenuti AMP e di visualizzarli utilizzando l'URL canonico anziché l'URL AMP.AMP dispone di un proprio strumento separato per la generazione di SXG.Scopri come pubblicare AMP utilizzando gli scambi firmati su amp.dev.

Eseguire il debug degli SXG con Chrome DevTools

Per vedere un SXG direttamente, utilizza un browser Chromium, apri DevTools, apri il riquadro Rete e visita questa pagina di ricerca di esempio. Le piattaforme di scambio pubblicitario con firma possono essere identificate cercando signed-exchange nella colonna Tipo.

Screenshot che mostra una richiesta SXG nel riquadro &quot;Rete&quot; di DevTools
Il riquadro Rete in DevTools

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

Screenshot della scheda &quot;Anteprima&quot; per un file SXG
Scheda Anteprima in DevTools

Utensili

L'implementazione degli SXG consiste nel generare lo SXG corrispondente a un determinato URL e poi pubblicarlo per i richiedenti (di solito i crawler).

Certificati

Per generare un SXG, devi disporre di un certificato che possa firmare gli SXG, anche se alcuni strumenti li acquisiscono automaticamente. In questa pagina sono elencate 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 presto lo avrà anche sxg-rs.

Strumenti SXG specifici della piattaforma

Questi strumenti supportano stack tecnologici specifici. Se utilizzi già una piattaforma supportata da uno di questi strumenti, potresti trovarla più facile da configurare rispetto a uno strumento generico.

Strumenti SXG per uso generico

Server HTTP sxg-rs

sxg-rs http_server funge da proxy inverso per la pubblicazione di SXG. Per le richieste dei crawler SXG, http_server firmerà le risposte del backend e risponderà con uno SXG. Per le istruzioni di installazione, consulta il file README.

Server Web Packager

Il server Web Packager,webpkgserver, è un'alternativa a http_server di sxg-rs, scritto in Go. Per istruzioni sulla configurazione del server Web Packager, consulta l'articolo Come configurare gli scambi firmati utilizzando Web Packager.

Interfaccia a riga di comando Web Packager

La CLI Web Packager genera un SXG corrispondente 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 tuo server e pubblicalo 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 di SXG:

  • sxg_rs è una libreria Rust per la generazione di SXG. È la libreria SXG più completa e viene utilizzata come base per gli strumenti cloudflare_worker e fastly_compute.

  • libsxg è una libreria C minima per la generazione di SXG. Viene utilizzato come base per il modulo NGINX SXG e per il filtro Envoy SXG.

  • go/signed-exchange è una libreria Go minima fornita dalla specifica del pacchetto web come implementazione di riferimento per la generazione di SXG. Viene utilizzato come base per lo strumento dell'interfaccia a riga di comando di riferimento, gen-signedexchange e per gli strumenti di Web Packager più completi.

Negoziazione dei contenuti

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

Questo consiglio include esempi per Apache e nginx.

Aggiorna API cache

La cache SXG di Google dispone di un'API che i proprietari di siti possono utilizzare per rimuovere gli SXG dalla cache prima della scadenza a causa di Cache-Control: max-age. Per informazioni dettagliate, consulta il riferimento all'API di aggiornamento della cache.

Collegamento a SXG

Qualsiasi sito può memorizzare nella cache, pubblicare e precaricare gli 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 tante possibili tecnologie per abilitare il precaricamento cross-origin. Quando decidi quale tecnologia utilizzare, potresti dover fare un compromesso tra l'ottimizzazione di aspetti diversi. Le sezioni seguenti illustrano alcuni dei valori unici forniti da SXG nell'ambito delle possibili soluzioni. Questi fattori possono cambiare nel tempo con l'evoluzione delle soluzioni disponibili.

Meno richieste da pubblicare

Con il precaricamento tra siti, il server potrebbe dover soddisfare richieste aggiuntive. Corrisponde ai casi in cui una pagina è stata prelevata, ma l'utente non l'ha visitata o i byte prelevati non sono stati mostrati all'utente. Per SXG, queste richieste aggiuntive inutilizzate possono essere ridotte in modo significativo:

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

Miglioramento della velocità di caricamento delle pagine

Potresti notare un ulteriore miglioramento della velocità della pagina grazie alle piattaforme e alle funzionalità di prefetching attualmente supportate:

  • Gli scambi SXG possono essere mostrati agli utenti con cookie per il tuo sito.
  • SXG esegue anche il precaricamento delle risorse secondarie per le tue pagine, come JavaScript, CSS, caratteri e immagini, se specificato utilizzando un'intestazione Link.
  • Nel prossimo futuro, il precaricamento SXG dalla Ricerca Google sarà disponibile per più tipi di risultati di ricerca.

Conclusione

Gli scambi firmati sono un meccanismo di pubblicazione che consente di verificare l'origine e la validità di una risorsa indipendentemente dal modo in cui è stata pubblicata. Di conseguenza, gli SXG possono essere distribuiti da terze parti mantenendo al contempo l'attribuzione completa del publisher.

Per approfondire