Javascript 从浏览器缓存中检索值
我已经创建了一个服务工作者,它执行一次提取,然后立即将数据存储在缓存中Javascript 从浏览器缓存中检索值,javascript,caching,browser-cache,cache-control,Javascript,Caching,Browser Cache,Cache Control,我已经创建了一个服务工作者,它执行一次提取,然后立即将数据存储在缓存中 self.addEventListener('install', async function(e) { try { const fileCache = await caches.open(CACHE_NAME); await fileCache.addAll(FILES_TO_CACHE); const dataCache = await caches.open(DA
self.addEventListener('install', async function(e) {
try {
const fileCache = await caches.open(CACHE_NAME);
await fileCache.addAll(FILES_TO_CACHE);
const dataCache = await caches.open(DATA_CACHE_NAME);
const dataFetchResponse = await fetch('/api/transaction');
return await dataCache.put('/api/transaction', dataFetchResponse);
} catch (error) {
console.log(error);
}
});
执行此操作后,我将尝试进行此操作,以便测试自上次数据获取以来的时间,以确定数据是否需要更新。我的Transaction
模型在数据上添加了一个时间戳,因此理想情况下,我希望根据当前时间测试最后一个事务的时间戳,但我不确定如何进行测试
我试图执行cache.match()
,但它没有返回匹配键的整个对象。我知道localStorage有一个.getItem()
方法,但我没有看到任何类似的缓存方法
这方面有什么想法吗?找到了获取信息的方法。您必须.match()
缓存中存储的数据的键
,因为它返回一个承诺,所以您将其转换为.json()
对象
async function getCachedData(cacheName, url) {
const cacheStorage = await caches.open(cacheName);
const cachedResponse = await cacheStorage.match(url); // Returns a promise w/ matched cache
if(!cachedResponse || !cachedResponse.ok) {return false}
console.log(await cachedResponse);
console.log(await cachedResponse.json()); // prints json object with value of key matched
return await cachedResponse.json();
};
什么是cache.match()
return?它将在缓存中返回一个匹配的值,但到目前为止,我看到的示例仅与键匹配,而与值不匹配。但返回的值不包含您想要知道的时间戳?我看到的示例将只返回键的值,即它的名称,而不返回其中包含的值。您可以控制台.log吗caches.match
在所有缓存中搜索,并在特定捕获中搜索cache.match()。它必须返回缓存的值,这就是服务人员的工作方式