我正在尝试查看离线状态演示 https://serviceworke.rs/offline-status_demo.html从下面的链接,我得到 DOMException: 超出配额。
https://serviceworke.rs/offline-status_demo.html https://serviceworke.rs/offline-status_demo.html
此错误仅出现在 chrome 中。在 Firefox 中运行正常,不会出现错误。
该错误发生在 Service Worker 的安装事件中。
下面发布了来自服务人员的代码以供参考。
// /serviceworker-cookbook/offline-status/
var CACHE_NAME = 'dependencies-cache';
// Files required to make this app work offline
var REQUIRED_FILES = [
'random-1.png',
'random-2.png',
'random-3.png',
'random-4.png',
'random-5.png',
'random-6.png',
'style.css',
'index.html',
'index.js',
'app.js'
];
self.addEventListener('install', function(event) {
// Perform install step: loading each required file into cache
event.waitUntil( // Error occurs here... Why???
caches.open(CACHE_NAME)
.then(function(cache) {
// Add all offline dependencies to the cache
console.log('[install] Caches opened, adding all core components' +
'to cache');
return cache.addAll(REQUIRED_FILES);
})
.then(function() {
console.log('[install] All required resources have been cached, ' +
'we\'re good!');
return self.skipWaiting();
})
);
});
self.addEventListener('fetch', function(event) {
event.respondWith(
caches.match(event.request)
.then(function(response) {
// Cache hit - return the response from the cached version
if (response) {
console.log(
'[fetch] Returning from ServiceWorker cache: ',
event.request.url
);
return response;
}
// Not in cache - return the result from the live server
// `fetch` is essentially a "fallback"
console.log('[fetch] Returning from server: ', event.request.url);
return fetch(event.request);
}
)
);
});
self.addEventListener('activate', function(event) {
console.log('[activate] Activating ServiceWorker!');
// Calling claim() to force a "controllerchange" event on navigator.serviceWorker
console.log('[activate] Claiming this ServiceWorker!');
event.waitUntil(self.clients.claim());
});
如何纠正这个错误?有没有办法提高chrome的配额限制?
EDIT1:
This link https://medium.com/dev-channel/offline-storage-for-progressive-web-apps-70d52695513c说 Chrome 检查每个源的配额限制,而 Firefox 则有无限配额。
有没有办法删除从源缓存的所有文件(重置为原始状态)?
Offline-status_demo 仅下载 700kb,因此本身不能超过 5MB Chrome 配额限制。除非 Chrome 缓存已满 - 如果您有的话也会出现这种情况too many打开选项卡。
答:在隐身模式下重试。
本文内容由网友自发贡献,版权归原作者所有,本站不承担相应法律责任。如您发现有涉嫌抄袭侵权的内容,请联系:hwhale#tublm.com(使用前将#替换为@)