Bir önbelleğe, öğelerin önbellekte ne kadar süreyle depolanacağına veya önbellekte kaç tane öğenin tutulması gerektiğiyle ilgili kısıtlamalar uygulamak yaygın bir istektir. Workbox, bu işlevi workbox-expiration
eklentisi aracılığıyla sağlar. Bu eklenti, önbellekteki giriş sayısını sınırlamanıza ve / veya uzun süre önbelleğe alınan girişleri kaldırmanıza olanak tanır.
Önbellek Girişlerinin Sayısını Kısıtla
Bir önbellekte depolanan giriş sayısını kısıtlamak için maxEntries
seçeneğini aşağıdaki gibi kullanabilirsiniz:
import {registerRoute} from 'workbox-routing';
import {CacheFirst} from 'workbox-strategies';
import {ExpirationPlugin} from 'workbox-expiration';
registerRoute(
({request}) => request.destination === 'image',
new CacheFirst({
cacheName: 'image-cache',
plugins: [
new ExpirationPlugin({
maxEntries: 20,
}),
],
})
);
Bununla, Eklenti bu rotaya eklenir. Önbelleğe alınan bir yanıt kullanıldıktan veya önbelleğe yeni bir istek eklendikten sonra, eklenti, yapılandırılan önbelleği inceler ve önbelleğe alınan giriş sayısının sınırı aşmadığından emin olur. Bu durumda en eski girişler kaldırılır.
Önbelleğe Alınan Girişlerin Yaşını Kısıtla
Bir isteğin önbelleğe alınma süresini kısıtlamak için maxAgeSeconds
seçeneğini kullanarak saniye cinsinden maksimum yaş tanımlayabilirsiniz. Örneğin:
import {registerRoute} from 'workbox-routing';
import {CacheFirst} from 'workbox-strategies';
import {ExpirationPlugin} from 'workbox-expiration';
registerRoute(
({request}) => request.destination === 'image',
new CacheFirst({
cacheName: 'image-cache',
plugins: [
new ExpirationPlugin({
maxAgeSeconds: 24 * 60 * 60,
}),
],
})
);
Eklenti, her istekten veya önbellek güncellemesinden sonra girişleri kontrol eder ve kaldırır.
Gelişmiş Kullanım
Diğer herhangi bir Workbox modülünden ayrı olarak geçerlilik sonu mantığını kullanmak istiyorsanız CacheExpiration
sınıfıyla bunu yapabilirsiniz.
Bir önbelleğe kısıtlamalar uygulamak amacıyla, denetlemek istediğiniz önbellek için CacheExpiration
örneği oluşturursunuz. Örneğin:
import {CacheExpiration} from 'workbox-expiration';
const cacheName = 'my-cache';
const expirationManager = new CacheExpiration(cacheName, {
maxAgeSeconds: 24 * 60 * 60,
maxEntries: 20,
});
Önbelleğe alınmış bir girişi her güncellediğinizde, yaşının güncellenmesi için updateTimestamp()
yöntemini çağırmanız gerekir.
await openCache.put(request, response);
await expirationManager.updateTimestamp(request.url);
Ardından, bir giriş grubunun geçerlilik süresini sona erdirmek istediğinizde, maxAgeSeconds
ve maxEntries
yapılandırmasını zorunlu kılan expireEntries()
yöntemini çağırabilirsiniz.
await expirationManager.expireEntries();
Türler
CacheExpiration
CacheExpiration
sınıfı, Cache
içinde depolanan yanıt sayısı için bir son kullanma tarihi ve / veya sınır tanımlamanıza olanak tanır.
Özellikler
-
oluşturucu
void
Yeni bir CacheExpiration örneği oluşturmak için
config
özelliklerinden en az birini sağlamanız gerekir.constructor
işlevi şu şekilde görünür:(cacheName: string, config?: CacheExpirationConfig) => {...}
-
cacheName
dize
Kısıtlamaların uygulanacağı önbelleğin adı.
-
config
CacheExpirationConfig isteğe bağlı
-
returns
-
-
delete
void
Önbellek geçerlilik sonu meta verilerini izlemek için kullanılan IndexedDB nesne deposunu kaldırır.
delete
işlevi şu şekilde görünür:() => {...}
-
returns
Promise<void>
-
-
expireEntries
void
Belirtilen önbellek ve belirtilen ölçütler için Geçerlilik sonu girişleri.
expireEntries
işlevi şu şekilde görünür:() => {...}
-
returns
Promise<void>
-
-
isURLExpired
void
Bir URL kullanılmadan önce geçerlilik süresinin dolup dolmadığını kontrol etmek için kullanılabilir.
Bu işlem IndexedDB'de aranmayı gerektirdiğinden yavaş olabilir.
Not: Bu yöntem önbelleğe alınan girişi kaldırmaz. IndexDB ve Cache girişlerini kaldırmak için
expireEntries()
çağrısı yapın.isURLExpired
işlevi şu şekilde görünür:(url: string) => {...}
-
url
dize
-
returns
Promise<boolean>
-
-
updateTimestamp
void
Belirtilen URL'nin zaman damgasını güncelleyin. Bu, maksimum giriş sayısına göre girişleri kaldırırken, en son kullanılan girişlerin doğru olmasını veya süresi dolduğunda zaman damgasının güncel olmasını sağlar.
updateTimestamp
işlevi şu şekilde görünür:(url: string) => {...}
-
url
dize
-
returns
Promise<void>
-
ExpirationPlugin
Bu eklenti, yaş ve / veya önbelleğe alınan isteklerin sayısına uygulanan bir sınırlama uygulamak için workbox-strategy
içinde kullanılabilir.
Yalnızca özel cacheName
özelliği kümesine sahip workbox-strategy
örnekleriyle kullanılabilir.
Diğer bir deyişle, varsayılan çalışma zamanı önbellek adını kullanan stratejideki girişlerin geçerlilik süresinin sona ermesi için kullanılamaz.
Önbelleğe alınan bir yanıt kullanıldığında veya güncellendiğinde bu eklenti, ilişkili önbelleği kontrol ederek eski ya da fazladan yanıtları kaldırır.
maxAgeSeconds
kullanılırken yanıtlar, süresi dolduktan sonra bir kez kullanılabilir. Çünkü önbellekteki yanıt kullanıldıktan sonra geçerlilik sonu temizleme işlemi gerçekleşmez. Yanıtta "Date" başlığı varsa basit bir süre sonu kontrolü gerçekleştirilir ve yanıt hemen kullanılmaz.
maxEntries
kullanılırken, en son istenen giriş önce önbellekten kaldırılır.
Özellikler
-
oluşturucu
void
constructor
işlevi şu şekilde görünür:(config?: ExpirationPluginOptions) => {...}
-
config
ExpirationPluginOptions isteğe bağlı
-
returns
-
-
deleteCacheAndMetadata
void
Bu, iki işlem gerçekleştiren yardımcı bir yöntemdir:
- Bu eklenti örneğiyle ilişkili tüm temel Önbellek örneklerini, sizin adınıza caches.delete() çağrısı yaparak siler.
- Her bir Önbellek örneğinin son kullanma ayrıntılarını takip etmek için kullanılan IndexedDB'den meta verileri siler.
Önbellek son kullanma tarihi kullanıldığında, doğrudan
caches.delete()
çağrısı yerine bu yöntemin çağrılması tercih edilir. Çünkü bu, IndexedDB meta verilerinin de temiz bir şekilde kaldırılmasını ve açık IndexedDB örneklerinin silinmesini sağlar.Belirli bir önbellek için önbellek geçerlilik sonu kullanmıyorsanız
caches.delete()
çağrısının ve önbelleğin adının iletilmesinin yeterli olacağını unutmayın. Böyle bir durumda temizleme için Workbox'a özgü bir yöntem gerekmez.deleteCacheAndMetadata
işlevi şu şekilde görünür:() => {...}
-
returns
Promise<void>
ExpirationPluginOptions
Özellikler
-
matchOptions
CacheQueryOptions isteğe bağlı
-
maxAgeSeconds
numara isteğe bağlı
-
maxEntries
numara isteğe bağlı
-
purgeOnQuotaError
boole isteğe bağlı