İmzalanmış HTTP Takasları (SXG) nginx kullanılarak nasıl dağıtılır?

Nginx kullanarak SXG dosyalarını alma ve sunma ve alt kaynağı önceden getirmenin zorlukları.

Hiroki Kumazaki
Hiroki Kumazaki

İmzalanmış HTTP Takası (SXG) distribütörü olarak SXG dosyalarını orijinal içerik üreticiler adına iletebilirsiniz. SXG'yi destekleyen web tarayıcıları, bu tür SXG dosyalarını orijinal içerik oluşturuculardan gönderilmiş gibi görüntüler. Bu, gizliliği ihlal etmeden siteler arası önceden yükleme uygulamanızı sağlar. Bu kılavuz, SXG'yi doğru bir şekilde nasıl dağıtacağınızı gösterir.

Tarayıcılar arası destek

Chrome, şu anda SXG'yi destekleyen tek tarayıcıdır. Daha güncel bilgiler için Kaynak İmzalı HTTP Takasları başlıklı makalenin mutabakat ve standartlaştırma bölümüne bakın.

SXG dosyalarını alma

Accept istek başlığınızda, sunucunun istekle birlikte bir SXG dosyası döndürmesini istediğinizi belirtin:

Accept: application/signed-exchange;v=b3,*/*;q=0.8

Bu kılavuzda, SXG dosyalarınızı /var/www/sxg hizmetine yerleştirdiğiniz varsayılmaktadır.

Basit bir SXG dosyası sunma

Tek bir SXG dosyası dağıtmak için aşağıdaki üstbilgileri ekleyin:

Content-Type: application/signed-exchange;v=v3
X-Content-Type-Options: nosniff

nginx ayarlarını yapılandırın:

http {
    ...
    types {
        application/signed-exchange;v=b3  sxg;
    }
    add_header X-Content-Type-Options nosniff;

    location / {
        more_set_headers "Content-Type: application/signed-exchange;v=b3";
        alias /var/www/sxg/;
        try_files $uri.sxg $uri =404;
        autoindex off;
    }
    ...

Yeni yapılandırmayı nginx uygulamasına yükleyin:

sudo systemctl restart nginx.service

nginx, SXG dosyaları yayınlamaya başlayacak. Chrome sunucunuza eriştiğinde, çubukta orijinal içerik yayıncısının adresi görünür!

Alt kaynakları önceden getir

Çoğu web sayfası CSS, JavaScript, yazı tipleri ve resimler gibi birden çok alt kaynaktan oluşur. SXG'nin içeriği, içeriği oluşturan kişinin özel anahtarı olmadan değiştirilemez. Bu durum, tarayıcı alt kaynakları çözümlemeye çalışırken sorunlara neden olur.

Örneğin, https://website.test/index.html alanından index.html.sxg alan adının https://website.test/app.js adresine sahip bir bağlantısına sahip olduğunu varsayalım. Bir kullanıcının tarayıcısı https://distributor.test/example.com/index.html.sxg kaynağından SXG dosyasını aldığında https://website.test/app.js bağlantısını bulur. Tarayıcı, gerçek erişimde https://website.test/app.js öğesini doğrudan getirebilir, ancak gizliliğin korunması için bu işlem, ön yükleme aşamasında yapılmamalıdır. Kaynak önceden yükleme aşamasında getirildiyse içerik oluşturucu (website.test), hangi içerik dağıtımcısının (distributor.test) kaynak istediğini tespit edebilir.

distribütör.test/index.html.sxg dosyasındaki app.js bağlantısı, website.test/app.js adresine yönlendiriyor.

Dağıtımcı, app.js.sxg ürününü kendi hizmetinden yayınlamak isterse ve https://website.test/app.js dosyasını, bu alt kaynağın dağıtımcı sürümü (ör. https://distributor.test/website.test/app.js.sxg) olacak şekilde değiştirmeye çalışırsa imza uyuşmazlığına neden olur ve SXG geçersiz hale gelir.

distribütör.test/index.html.sxg'deki referansı app.js'ye, distribütör.test/app.js'ye bağlama girişimi, imza uyuşmazlığına neden oluyor.

Bu sorunu çözmek için artık Chrome'da deneysel bir SXG alt kaynağı önceden getirme özelliği bulunuyor. Bu özelliği about://flags/#enable-sxg-subresource-prefetching adresinden etkinleştirebilirsiniz. Alt kaynağı önceden getirme özelliğini kullanmak için aşağıdaki koşulların karşılanması gerekir:

  • Yayıncı, SXG'ye bir yanıt başlığı girişi yerleştirmelidir. Örneğin: link: <https://website.test/app.js>;rel="preload";as="script",<https://website.test/app.js>;rel="allowed-alt-sxg";header-integrity="sha256-h6GuCtTXe2nITIHHpJM+xCxcKrYDpOFcIXjihE4asxk=". Bu, SXG'nin özel bütünlük karmasıyla değiştirilebilecek alt kaynağı belirtir.
  • Dağıtımcı, SXG için yayın yaparken link: <https://distributor.test/website.test/app.js.sxg>;rel="alternate";type="application/signed-exchange;v=b3";anchor="https://website.test/app.js" gibi bir yanıt başlığı eklemelidir. Bu, app.js yolunu belirtir ve alt kaynağa karşılık gelir.

anchor

İlki nispeten kolaydır, çünkü nginx-sxg-module bütünlük karmalarını hesaplayabilir ve bunları yukarı akış yanıtlarından bağlantı başlıklarına yerleştirebilir. Ancak ikincisi daha zordur. Çünkü içerik dağıtımcısının SXG'de belirtilen alt kaynakları bilmesi gerekir.

https://website.test/app.js dışında bir alt kaynak yoksa nginx yapılandırmanıza eklemeniz gereken tek şey şudur:

add_header link <https://distributor.test/website.test/app.js.sxg>;rel="alter...

Ancak tipik web siteleri pek çok alt kaynak içerdiğinden bu tür durumlar nadiren görülür. Ayrıca dağıtımcı, SXG dosyası sunarken uygun bağlantı bağlantısı başlığını eklemelidir. Şu anda bu sorunu çözmenin kolay bir yolu yoktur. Bu nedenle güncellemeler için bizi takip etmeye devam edin!

Geri bildirim gönderme

Chromium mühendisleri, SXG'nin dağıtımıyla ilgili geri bildiriminizi webpackage-dev@chromium.org adresinden duymayı çok istiyor. Ayrıca spesifikasyonlarla ilgili tartışmaya katılabilir veya ekibe hata bildirebilirsiniz. Geri bildiriminiz standartlaştırma sürecine çok yardımcı olacak ve uygulama sorunlarının çözülmesine yardımcı olacaktır. Teşekkürler!