Varsayılan olarak daha yeni hizmet çalışanları

Jeff Posnick

özet

Chrome 68'den itibaren, hizmet çalışanı komut dosyasında güncelleme olup olmadığını kontrol eden HTTP istekleri varsayılan olarak HTTP önbelleği tarafından karşılanmayacak. Bu, hizmet çalışanı komut dosyanızda yanlışlıkla bir Cache-Control başlığı ayarlayarak güncellemelerin gecikmesine neden olabilecek geliştiricilerin sık karşılaştıkları bir sorunu giderir.

/service-worker.js komut dosyanızı Cache-Control: max-age=0 ile yayınlayarak HTTP önbelleğe alma özelliğini devre dışı bıraktıysanız yeni varsayılan davranış nedeniyle herhangi bir değişiklik görmezsiniz.

Ayrıca, Chrome 78'den itibaren bayt bayt karşılaştırma, importScripts() aracılığıyla bir hizmet çalışanına yüklenen komut dosyalarına uygulanacaktır. İçe aktarılan bir komut dosyasında yapılan her değişiklik, üst düzey hizmet çalışanında yapılan bir değişiklik gibi hizmet çalışanı güncelleme akışını tetikler.

Arka plan

Bir hizmet çalışanının kapsamı altındaki yeni bir sayfaya her gittiğinizde, JavaScript'den registration.update()'u açıkça çağırdığınızda veya bir hizmet çalışanı push veya sync etkinliği aracılığıyla "uyandırıldığında" tarayıcı, hizmet çalışanı komut dosyasında güncelleme olup olmadığını kontrol etmek için paralel olarak navigator.serviceWorker.register() çağrısına ilk başta iletilen JavaScript kaynağını ister.

Bu makale kapsamında, URL'sinin /service-worker.js olduğunu ve hizmet işçisinde çalıştırılan ek kodu yükleyen importScripts() çağrısını içerdiğini varsayalım:

// Inside our /service-worker.js file:
importScripts('path/to/import.js');

// Other top-level code goes here.

Neler değişiyor?

Chrome 68'den önce /service-worker.js için güncelleme isteği, çoğu getirme işleminde olduğu gibi HTTP önbelleği üzerinden yapılırdı. Bu, komut dosyası başlangıçta Cache-Control: max-age=600 ile gönderilmişse sonraki 600 saniye (10 dakika) içindeki güncellemelerin ağa gönderilmeyeceği anlamına gelir. Bu nedenle kullanıcı, hizmet çalışanının en güncel sürümünü alamayabilir. Ancak max-age 86.400'den (24 saat) fazlaysa kullanıcıların belirli bir sürümde kalmasını önlemek için 86.400 olarak değerlendirilir.

68 sürümünden itibaren, hizmet çalışanı komut dosyasında güncelleme isteğinde bulunurken HTTP önbelleği yoksayılacak. Bu nedenle, mevcut web uygulamalarında hizmet çalışanı komut dosyasına yönelik isteklerin sıklığında artış görülebilir. importScripts istekleri yine de HTTP önbelleği üzerinden gönderilir. Ancak bu yalnızca varsayılan ayardır. Bu davranış üzerinde kontrol sunan yeni bir kayıt seçeneği olan updateViaCache mevcuttur.

updateViaCache

Geliştiriciler artık navigator.serviceWorker.register()'ü çağırırken yeni bir seçenek gönderebilir: updateViaCache parametresi. Üç değerden birini alır: 'imports', 'all' veya 'none'.

Değerler, güncellenmiş hizmet çalışanı kaynaklarını kontrol etmek için HTTP isteği yapılırken tarayıcının standart HTTP önbelleğini kullanıp kullanmayacağını ve nasıl kullanacağını belirler.

  • 'imports' olarak ayarlandığında, /service-worker.js komut dosyasında güncelleme olup olmadığı kontrol edilirken HTTP önbelleği hiçbir zaman kullanılmaz ancak içe aktarılan komut dosyaları (örneğimizde path/to/import.js) getirilirken kullanılır. Bu, varsayılan ayardır ve Chrome 68'den itibaren geçerli olan davranışla aynıdır.

  • 'all' olarak ayarlandığında, hem üst düzey /service-worker.js komut dosyası hem de hizmet işleyiciye içe aktarılan tüm komut dosyaları (ör. path/to/import.js) için istek yapılırken HTTP önbelleği kullanılır. Bu seçenek, Chrome 68'den önceki Chrome sürümlerindeki önceki davranışa karşılık gelir.

  • 'none' olarak ayarlandığında, üst düzey /service-worker.js veya içe aktarılan komut dosyaları (ör. varsayımsal path/to/import.js) için istek yapılırken HTTP önbelleği sorgulanmayacaktır.

Örneğin, aşağıdaki kod bir hizmet çalışanı kaydeder ve /service-worker.js komut dosyasında veya /service-worker.js içindeki importScripts() aracılığıyla referans verilen komut dosyalarında güncelleme olup olmadığı kontrol edilirken HTTP önbelleğe hiçbir zaman danışılmamasını sağlar:

if ('serviceWorker' in navigator) {
  navigator.serviceWorker.register('/service-worker.js', {
    updateViaCache: 'none',
    // Optionally, set 'scope' here, if needed.
  });
}

İçe aktarılan komut dosyalarında güncelleme olup olmadığını kontrol eder.

Chrome 78'den önce, importScripts() üzerinden yüklenen tüm hizmet çalışanı komut dosyaları yalnızca bir kez alınır (updateViaCache yapılandırmasına bağlı olarak önce HTTP önbelleğiyle veya ağ üzerinden kontrol edilir). Bu ilk getirme işleminden sonra, tarayıcı tarafından dahili olarak depolanır ve hiçbir zaman yeniden getirilmez.

Halihazırda yüklü bir hizmet çalışanını, içe aktarılan bir komut dosyasında yapılan değişiklikleri algılamaya zorlamanın tek yolu, komut dosyasının URL'sini değiştirmekti.Bu işlem genellikle bir semver değeri (ör. importScripts('https://example.com/v1.1.0/index.js')) ekleyerek veya içeriğin karmasını ekleyerek yapılırdı (ör.importScripts('https://example.com/index.abcd1234.js')). İçe aktarılan URL'nin değiştirilmesinin bir yan etkisi, üst düzey hizmet çalışanı komut dosyasının içeriğinin değişmesidir. Bu da hizmet çalışanı güncelleme akışını tetikler.

Chrome 78'den itibaren, üst düzey bir hizmet çalışanı dosyası için her güncelleme kontrolü yapıldığında, içe aktarılan komut dosyalarının içeriğinin değişip değişmediğini belirlemek için aynı anda kontroller yapılır. Kullanılan Cache-Control üstbilgilerine bağlı olarak, içe aktarılan bu komut dosyası kontrolleri, updateViaCache 'all' veya 'imports' (varsayılan değer) olarak ayarlanmışsa HTTP önbelleği tarafından yerine getirilebilir ya da updateViaCache 'none' olarak ayarlanmışsa doğrudan ağa gönderilebilir.

İçe aktarılan bir komut dosyası için yapılan güncelleme kontrolü, daha önce hizmet çalışanı tarafından depolananla karşılaştırıldığında bayt bayt fark oluşturursa üst düzey hizmet çalışanı dosyası aynı kalsa bile hizmet çalışanının tam güncelleme akışı tetiklenir.

Chrome 78'deki davranış, Firefox'un birkaç yıl önce Firefox 56'da uyguladığı davranışla aynıdır. Safari de bu davranışı zaten uygulamaktadır.

Geliştiricilerin yapması gerekenler

/service-worker.js komut dosyanızı Cache-Control: max-age=0 (veya benzer bir değer) ile yayınlayarak HTTP önbelleğe alma özelliğini etkin bir şekilde devre dışı bıraktıysanız yeni varsayılan davranış nedeniyle herhangi bir değişiklik görmezsiniz.

/service-worker.js komut dosyanızı, HTTP önbelleğe alma özelliği etkinleştirilmiş şekilde (kasıtlı olarak veya barındırma ortamınız için varsayılan olarak) sunarsanız sunucunuza yönelik /service-worker.js için ek HTTP isteklerinin arttığını görmeye başlayabilirsiniz. Bunlar, eskiden HTTP önbelleği tarafından karşılanan isteklerdir. Cache-Control başlık değerinin /service-worker.js öğenizin güncelliğini etkilemesine izin vermeye devam etmek istiyorsanız hizmet işleyicinizi kaydederken updateViaCache: 'all' değerini açıkça ayarlamaya başlamanız gerekir.

Eski tarayıcı sürümlerini kullanan çok sayıda kullanıcı olabileceğinden, yeni tarayıcılar bu üstbilgileri yok saysa bile hizmet çalışanı komut dosyalarında Cache-Control: max-age=0 HTTP üstbilgisini ayarlamaya devam etmek iyi bir fikirdir.

Geliştiriciler, içe aktarılan komut dosyalarını HTTP önbelleğe alma özelliğinden hemen hariç tutmak isteyip istemediklerine karar vermek için bu fırsattan yararlanabilir ve uygunsa hizmet işleyici kayıtlarına updateViaCache: 'none' ekleyebilir.

İçe aktarılan komut dosyalarını yayınlama

Chrome 78'den itibaren geliştiriciler, importScripts() üzerinden yüklenen kaynaklar için daha fazla gelen HTTP isteği görebilir. Bunun nedeni, bu kaynaklarda güncelleme olup olmadığına bakılmasıdır.

Bu ek HTTP trafiğini önlemek istiyorsanız URL'lerinde semver veya karma oluşturma işlemleri içeren komut dosyalarını yayınlarken uzun ömürlü Cache-Control üstbilgileri ayarlayın ve 'imports''nin varsayılan updateViaCache davranışını kullanın.

Alternatif olarak, içe aktarılan komut dosyalarınızın sık sık güncellemeler açısından kontrol edilmesini istiyorsanız bunları Cache-Control: max-age=0 ile yayınladığınızdan veya updateViaCache: 'none''ı kullandığınızdan emin olun.

Daha fazla bilgi

Jake Archibald tarafından yazılan "Hizmet İşleyici Yaşam Döngüsü" ve "Önbelleğe almayla ilgili en iyi uygulamalar ve maksimum yaşla ilgili dikkat edilmesi gereken noktalar ", web'e herhangi bir şey dağıtan tüm geliştiricilere okumaları önerilir.