İmzalı Takaslar (SXG'ler)

SXG, kimlik doğrulamasını mümkün kılan bir iletim mekanizmasıdır. nasıl teslim edildiğine bakılmaksızın bir kaynağın

Katie Hempenius
Katie Hempenius
Devin Mullins
Devin Mullins

İmzalı takaslar (SXG), bir kaynağın kaynağında kimlik doğrulamasının, nasıl teslim edildiğine bakılmaksızın bağımsız olarak doğrulanmasını mümkün kılan bir teslim mekanizmasıdır. SXG'nin uygulanması, gizliliği koruyan çapraz kaynak önceden getirme özelliğini etkinleştirerek Largest Contentful Paint'i (LCP) iyileştirebilir. Ayrıca bu ayırma, çevrimdışı internet deneyimleri ve üçüncü taraf önbelleklerinden reklam sunma gibi çeşitli kullanım alanlarını geliştirir.

Bu makalede SXG'ye dair kapsamlı bir genel bakış sunulmaktadır: İşleyiş şekli, kullanım alanları ve araçlar.

Tarayıcı uyumluluğu

SXG, Chromium tabanlı tarayıcılar tarafından desteklenir. (Chrome 73, Edge 79 ve Opera 64 sürümlerinden itibaren).

Genel Bakış

SXG, birincil kullanım alanı olarak kaynak tarafından kriptografik olarak imzalanmış içerikleri önceden getirmek ve sunmak için önbellek kullanır. Bu, sayfaların değiştirilmeden kalmasını ve kaynaklarıyla doğru bir şekilde ilişkilendirilmesini sağlarken, yönlendiren sitelerden gelen kaynaklar arası gezinmelerin hızlanmasına yardımcı olur. Kimliği tanımlayabilecek tüm bilgiler, kullanıcı bir siteye gidene kadar gizlenir. Bu sayede kullanıcının gizliliği korunur. SXG'nin önceden getirme özelliklerinin ilk kullanıcılarından biri olan Google Arama, trafiğinin büyük bir kısmını Google Arama'dan alan siteler açısından kullanıcılara daha hızlı sayfa yüklemeleri sağlamak açısından önemli bir araç olabilir. Bu etkinin zamanla daha fazla kullanıcıya ulaştırılacağını umuyoruz.

İşleyiş Şekli

Bir site, bir istek/yanıt çiftini ("HTTP değişimi") imzalayarak Google'ın HTTP kullanıcılarının içeriğin kaynağını ve bütünlüğünü kendisinden bağımsız olarak, nasıl dağıtıldığı. Sonuç olarak, tarayıcı gönderen sunucunun URL'si yerine kaynak siteyi içeriği teslim etti.

İmzalı Takasların İşleyiş Şeklini gösteren şema. Hedef siteyle iletişim kuran önbellek ile iletişim kuran tarayıcı

Geçmişte, bir sorun yaşamanın tek yolu bir üçüncü tarafı kullanarak içeriği dağıtmaya devam etmesini ve ilişkilendirme, bu sitenin SSL sertifikalarını distribütörüm. Bunun güvenlik açısından dezavantajları vardır; Ayrıca bu proje için gerçekten taşınabilir hale getiriyor.

SXG biçimi

SXG, iki parametre içeren ikili kodlu bir dosyaya kapsüllenir: birincil bileşenlerden oluşur: HTTP exchange'i ve imza dört temel öğe bulunur. HTTP exchange'i bir istek URL'si, içerik adı ve bir HTTP yanıtı ekleyin.

Kodu çözülmüş bir SXG dosyası örneğini burada bulabilirsiniz.

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>

İmzadaki expires parametresi, SXG'nin geçerlilik bitiş tarihini belirtir. CEVAP SXG en fazla 7 gün boyunca geçerli olabilir. Daha fazla bilgi için: İmzalanmış HTTP Değişimleri'ndeki imza üstbilgisini spesifikasyonlarını inceleyin.

Sunucu tarafı kişiselleştirme desteği

Vary: Cookie başlığı içeren bir SXG, yalnızca başlığı böyle olmayan kullanıcılara gösterilir imzalı istek URL'si için çerezlere sahip olmalıdır. Siteniz farklı HTML sunuyorsa açısından, bu özelliği kullanarak değerli teklif stratejilerinden yararlanabilirsiniz. en iyi uygulamaları paylaşacağım. Sunucu tarafı kişiselleştirme ile ilgili ayrıntılara bakın .

Web Paketi

SXG, daha geniş kapsamlı Web Paketleme spesifikasyon teklifi ailesi. Ayrıca Web Paketleme spesifikasyonunun diğer ana bileşeni Web Paketleri'dir. . Web Paketleri, HTTP kaynakları ve meta verileri de ekleyebilirsiniz.

SXG'ler ile Web Paketleri arasındaki ilişki sık karşılaşılan bir kafa karışıklığıdır. SXG ve Web Bundle, birbirlerine bağımlı olmayan iki ayrı teknolojidir. other - Web paketleri, hem imzalı hem de imzasız takaslarla kullanılabilir. Yaygın bir hem SXG'ler hem de Web Bundle'lar tarafından geliştirilen hedef, bir "web paketi" oluşturmaktır. biçim olarak kullanabilirsiniz.

İmzalı Değişim İşlemleriyle Sayfa Yüklemelerini Hızlandırma

İmzalı Takasları etkinleştirmek, web sayfası performansını hızlandırmaya yardımcı olabilir ve dolayısıyla, Özellikle Largest Contentful Paint (LCP) metriğinde sitenizin Core Web Vitals'ı etkileyebilir. İlk kullanıcılardan biri olan Google Arama, kullanıcılara arama sonuçları sayfasından yüklenen sayfalarda daha hızlı sayfa yükleme deneyimi sunmak için SXG'yi kullanır.

Google Arama, SXG'leri (varsa) tarayıp önbelleğe alır ve kullanıcının ziyaret etme olasılığı yüksek olan SXG'yi (örneğin, ilk arama sonucuna karşılık gelen sayfa) önceden getirir.

SXG, en iyi performansı CDN'lerin kullanımı ve oluşturma engelleyici alt kaynakların azaltılması gibi diğer performans optimizasyonlarıyla birlikte gösterir. Uyguladıktan sonra, SXG'leri önceden getirmenin LCP avantajını en üst düzeye çıkarmak için bu önerileri uygulayın. Çoğu durumda, bu tür optimizasyon neredeyse anında sayfa yüklemelerinin Google Arama'dan gelmesiyle sonuçlanabilir:

İmzalı Takasların Etkisi

Geçmiş denemelerde, SXG özellikli önceden getirme işlemlerinden LCP'de ortalama 300 ms ila 400 ms'lik bir düşüş gözlemledik. Böylece siteler kullanıcılarda daha iyi bir ilk izlenim bırakır ve genellikle işletme metrikleri üzerinde olumlu bir etkisi olur.

Birçok küresel marka ve site İmzalı Takaslardan faydalanmıştır. Örnek bir olay olarak, imzalı takasları uygulamanın, önde gelen bir içerik yönetim sistemi (İYS) olan RebelMouse'un, müşterilerinin performans ve işletme metrikleri:

  • Narcity LCP'yi%41 artırdı
  • Paper Magazine, kullanıcı başına oturum sayısında% 27'lik bir artış tespit etti.
  • MLT Blog sayfa yükleme süresini%21 azalttı

Cloudflare, SXG'nin test ettiği sitelerin% 98'inde TTFB'yi iyileştirdiğini ve sitelerin% 85'inde LCP'yi iyileştirdiğini Cloudflare'nin, SXG'ye uygun sayfa yüklemelerinde ortalama% 20'nin üzerinde bir ortanca değer artışı sağladığını tespit etti.

Dizine ekleme

Bir sayfanın SXG ve SXG olmayan temsilleri sıralanmaz veya dizine eklenmemiştir Google Arama'ya göre değişiyor. SXG sonuçta bir teslim mekanizmasıdır; temel içeriği değiştirebilirsiniz.

AMP

AMP içeriği, SXG kullanılarak yayınlanabilir. SXG, AMP içeriğinin önceden getirilmesine olanak tanır ve AMP URL'si yerine kendi standart URL'si kullanılarak görüntülenir.AMP, araçlarını kullanabilirsiniz. amp.dev.

Chrome Geliştirici Araçları ile SXG'lerde hata ayıklama

SXG'yi ilk elden görmek için Chromium tarayıcı kullanın, Geliştirici Araçları'nı açın, Ağ panelini açın ve bu örnek arama sayfasını ziyaret edin. İmzalı Takaslar, Tür sütununda signed-exchange ifadesi aratılarak tanımlanabilir.

&quot;Ağ&quot; içindeki bir SXG isteğini gösteren ekran görüntüsü Geliştirici Araçları paneli
Geliştirici Araçları'ndaki paneli

Önizleme sekmesi, bir SXG'nin içeriği hakkında daha fazla bilgi sağlar.

&quot;Preview&quot; (Önizleme) ekran görüntüsü SXG sekmesi
Geliştirici Araçları'ndaki Önizleme sekmesi

Alet

SXG'lerin uygulanması, belirli bir URL'ye karşılık gelen SXG'nin oluşturulmasından oluşur. ve ardından bu SXG'yi istekte bulunanlara (genellikle tarayıcılar) sunma.

Sertifikalar

SXG oluşturmak için, SXG'leri imzalayabilen bir sertifikaya ihtiyacınız vardır. Bununla birlikte, bazı araçlar bunları otomatik olarak alır. Bu sayfada, bu tür sertifikalar yayınlayabilen sertifika yetkilileri listelenmiştir. Sertifikalar, herhangi bir ACME istemcisi kullanılarak Google sertifika yetkilisinden otomatik olarak alınabilir. Web Paketleyici Sunucusu'nda yerleşik bir ACME istemcisi bulunmaktadır. Yakında sxg-rs'ler de eklenecektir.

Platforma özel SXG araçları

Bu araçlar belirli teknoloji yığınlarını destekler. Halihazırda bir bir platform tarafından desteklendiğini varsayalım. Bu aracı kurmak yerine bir araçtır.

Genel amaçlı SXG araçları

sxg-rs HTTP sunucusu

sxg-rs http_server bir ters proxy işlevi görür çok iyi bir çözümdür. http_server, SXG tarayıcılarından gelen istekler için arka uçtan yanıt vermeli ve SXG ile cevap vermelidir. Kurulum İçin daha fazla bilgi için BENİOKU.

Web Paketleyici Sunucusu

Web Packager Sunucu, webpkgserver, Go'da yazılan sxg-rs http_server yerine bir alternatiftir. Örneğin, kurulum talimatları için bkz. İmzalanmış exchange'ler aracılığıyla web Packager'ı kullanabilirsiniz.

Web Packager KSA

Web Packager KSA bir SXG oluşturur kullanabilirsiniz.

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

SXG dosyası oluşturulduktan sonra dosyayı sunucunuza yükleyin ve application/signed-exchange;v=b3 MIME türü. Ayrıca, SXG sertifikasını application/cert-chain+cbor olarak sunacaktır.

SXG kitaplıkları

Aşağıdaki kitaplıklar kendi SXG oluşturma aracınızı oluşturmak için kullanılabilir:

  • sxg_rs şu kullanıcılar için bir Rust kitaplığıdır: büyük önem taşır. En önemli SXG kitaplığıdır ve cloudflare_worker ve fastly_compute araçlarının temelini oluşturur.

  • libsxg, şunlar için minimal bir C kitaplığıdır: büyük önem taşır. NGINX SXG modülünün temeli olarak kullanılır ve Envoy SXG Filtresi.

  • go/signed-exchange webpackage spesifikasyonu tarafından sağlanan minimal bir Go kitaplığıdır: referans büyük önem taşır. Bu panel, referans KSA aracı için temel olarak kullanılmaktadır. gen-signedexchange Web Packager araçlarıyla ilgili daha fazla bilgi edineceksiniz.

İçerik pazarlığı

Kabul Et başlığı, application/İmzalı-exchange için q değerinin, metin/html'nin q değerinden büyük veya bu değere eşit olduğunu belirttiğinde sunucular SXG sunmalıdır. Pratikte bu, kaynak sunucunun SXG'yi tarayıcılara sunacağı ancak tarayıcılara sunmayacağı anlamına gelir. Yukarıdaki araçların birçoğu bu işlemi varsayılan olarak yapar. Ancak diğer araçlar için aşağıdaki normal ifade, SXG olarak sunulması gereken isteklerin Kabul etme başlığını eşleştirmek amacıyla kullanılabilir: http Accept: /(^|,)\s\*application\/signed-exchange\s\*;\s\*v=[[:alnum:]\_-]+\s\*(,|$)/.

Bu öneride Apache ve nginx için örnekler bulunmaktadır.

Önbellek API'sini güncelle

Google SXG Cache, site sahiplerinin Cache-Control: max-age nedeniyle süresi dolmadan önce SXG'leri önbellekten kaldırmak için kullanabilecekleri bir API'ye sahiptir. Ayrıntılar için önbellek güncelleme API'si referansı başlıklı makaleyi inceleyin.

SXG'ye bağlama

Herhangi bir site, varsa ve etiketlerini kullanarak bağlantı verdiği sayfaların SXG'lerini önbelleğe alabilir, sunabilir ve önceden getirebilir: html <a href="https://example.com/article.html.sxg"> <link rel="prefetch" as="document" href="https://example.com/article.html.sxg"> Bu makalede, SXG'leri dağıtmak için nginx'in nasıl kullanılacağı gösterilmektedir.

Benzersiz Avantajlar

SXG, kaynaklar arası önceden getirmeyi mümkün kılan birçok teknolojiden biridir. Hangi teknolojiyi kullanacağınıza karar verirken farklı yönleri optimize etmeniz gerekebilir. Aşağıdaki bölümlerde SXG'nin olası çözümler alanında sağladığı benzersiz değerlerden birkaçı gösterilmektedir. Mevcut çözümlerin alanı değiştikçe bu faktörler zaman içinde değişebilir.

Daha az reklam yayınlama isteği

Siteler arası önceden getirme ile sunucunuzun ek istekler sunması gerekebilir. Bu, bir sayfanın önceden getirildiği ancak kullanıcının sayfayı ziyaret etmediği veya önceden getirilen baytların kullanıcıya gösterilemediği durumlara karşılık gelir. SXG'de, kullanılmayan şu ek istekler önemli ölçüde azaltılabilir:

  • SXG'ler önbelleğe alınır ve süreleri dolana kadar kullanıcılara gönderilebilir. Dolayısıyla, birçok önceden getirme işlemi yalnızca önbellek sunucusu tarafından işlenebilir.
  • SXG'ler, sitenizde çerezleri olan veya olmayan kullanıcılara gösterilebilir. Bu sayede, gezinmeden sonra sayfanın tekrar getirilmesi gereken zamanlar daha az olur.

Sayfa hızında iyileşme

Şu anda desteklediği önceden getirme platformları ve özellikleri nedeniyle sayfa hızında ek iyileştirmeler görebilirsiniz:

  • SXG'ler, sitenize ait çerezleri olan kullanıcılara gösterilebilir.
  • SXG, Link üstbilgisi kullanılarak belirtildiğinde sayfalarınız için JavaScript, CSS, yazı tipleri ve resimler gibi alt kaynakları da önceden getirir.
  • Yakın gelecekte, Google Arama'dan SXG önceden getirme özelliği daha fazla arama sonucu türünde kullanılabilecektir.

Sonuç

İmzalı Değişimler, sözleşmenin imzalanmasını mümkün kılan bir teslim mekanizmasıdır. ne şekilde ortaya çıktığından bağımsız olarak kaynağın kaynağı ve geçerliliği teslim edilir. Sonuç olarak, SXG'ler üçüncü taraflarca dağıtılabilir. tam yayıncı ilişkilendirmesini sürdürme.

Daha fazla bilgi