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
İ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.
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.
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>
İ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.
!["Ağ" içindeki bir SXG isteğini gösteren ekran görüntüsü Geliştirici Araçları paneli](https://web.dev/static/articles/signed-exchanges/image/screenshot-showing-sxg-r-9a4f9df2440b3.png?authuser=9&hl=tr)
Önizleme sekmesi, bir SXG'nin içeriği hakkında daha fazla bilgi sağlar.
!["Preview" (Önizleme) ekran görüntüsü SXG sekmesi](https://web.dev/static/articles/signed-exchanges/image/screenshot-the-preview-033e1253a3e1.png?authuser=9&hl=tr)
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.
Otomatik İmzalı Exchange'ler, Cloudflare özelliği, otomatik olarak sertifika edinip İmzalı Takaslar.
NGINX SXG modülü ve nginx kullanan siteler için SXG'ler sunar. Kur talimatlara buradan ulaşabilirsiniz.
Envoy SXG Filtrele Google Etiket Yöneticisi'ni kullanan siteler için Envoy.
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 vecloudflare_worker
vefastly_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.