简体   繁体   中英

How to resolve `Uncaught (in promise) DOMException: Quota exceeded` error in service worker when browsing website in `Incognito mode` in Google chrome

How to resolve(or hide) Uncaught (in promise) DOMException: Quota exceeded error in service worker when browsing website in Incognito mode in Google chrome.

Every thing works fine in normal mode.

Service worker code of my progressive web app is

var version = 'v2:';
var offlineFundamentals = [
    '/',
    '/offline.html'
];
var updateStaticCache = function () {
    return caches.open(version + 'fundamentals').then(function (cache) {
        return Promise.all(offlineFundamentals.map(function (value) {
            var request = new Request(value);
            var url = new URL(request.url);
            if (url.origin != location.origin) {
                request = new Request(value, {
                    mode: 'no-cors'
                });
            }
            return fetch(request).then(function (response) {
                var cachedCopy = response.clone();
                return cache.put(request, cachedCopy);
            });
        }))
    })
};
var clearOldCaches = function () {
    return caches.keys().then(function (keys) {
        return Promise.all(keys.filter(function (key) {
            return key.indexOf(version) != 0;
        }).map(function (key) {
            return caches.delete(key);
        }));
    });
};
var limitCache = function (cache, maxItems) {
    cache.keys().then(function (items) {
        if (items.length > maxItems) {
            cache.delete(items[0]);
        }
    })
};
var trimCache = function (cacheName, maxItems) {
    caches.open(cacheName).then(function (cache) {
        cache.keys().then(function (keys) {
            if (keys.length > maxItems) {
                cache.delete(keys[0]).then(trimCache(cacheName, maxItems));
            }
        });
    });
};
var hasUrlCacheExcludeMatch = function (url) {
    var cacheExcludeUrls = [
        "https:\/\/example.com\/user\/login",
        "https:\/\/example.com\/user\/register"
    ];
    return cacheExcludeUrls.some(path => url.includes(path));
};
self.addEventListener("install", function (event) {
    event.waitUntil(updateStaticCache().then(function () {
        return self.skipWaiting();
    }));
});
self.addEventListener("message", function (event) {
    var data = event.data;
    if (data.command == "trimCache") {
        trimCache(version + "pages", 80);
        trimCache(version + "images", 50);
        trimCache(version + "assets", 50);
    }
});
self.addEventListener("fetch", function (event) {
    var fetchFromNetwork = function (response) {
        var cacheCopy = response.clone();
        if (event.request.headers.get('Accept').indexOf('text/html') != -1) {
            if (!hasUrlCacheExcludeMatch(event.request.url)) {
                caches.open(version + 'pages').then(function (cache) {
                    cache.put(event.request, cacheCopy).then(function () {
                        limitCache(cache, 80);
                    })
                });
            }
        } else if (event.request.headers.get('Accept').indexOf('image') != -1) {
            caches.open(version + 'images').then(function (cache) {
                cache.put(event.request, cacheCopy).then(function () {
                    limitCache(cache, 50);
                });
            });
        } else {
            caches.open(version + 'assets').then(function add(cache) {
                cache.put(event.request, cacheCopy).then(function () {
                    limitCache(cache, 50);
                });
            });
        }
        return response;
    }
    var fallback = function () {
        if (event.request.headers.get('Accept').indexOf('text/html') != -1) {
            return caches.match(event.request).then(function (response) {
                return response || caches.match('/offline.html');
            })
        }
    }
    if (event.request.method != 'GET') {
        return;
    }
    if (event.request.headers.get('Accept').indexOf('text/html') != -1) {
        event.respondWith(fetch(event.request).then(fetchFromNetwork, fallback));
        return;
    }
    event.respondWith(caches.match(event.request).then(function (cached) {
        return cached || fetch(event.request).then(fetchFromNetwork, fallback);
    }))
});
self.addEventListener("activate", function (event) {
    event.waitUntil(clearOldCaches().then(function () {
        return self.clients.claim();
    }));
});

Browsing website in Normal mode in Google chrome works fine no error occures in console. I am not good in service worker so I am unable to resolve this issue.

This is a bit unobvious.

Quota exceed error means that your out of available space, which is 6% of total space for Chrome.

For incognito mode all storage and workers api is working, but quota space is equals zero bytes and, thus, you can not write to it.

The technical post webpages of this site follow the CC BY-SA 4.0 protocol. If you need to reprint, please indicate the site URL or the original address.Any question please contact:yoyou2525@163.com.

 
粤ICP备18138465号  © 2020-2024 STACKOOM.COM