未捕获(承诺)DOMException:超出配额 [英] Uncaught (in promise) DOMException: Quota exceeded

问题描述

我正在尝试通过下面的链接查看演示脱机状态，并且我得到了DOMException : 超出配额.

I am trying to see the demo of offline status from the below link and I get DOMException: Quota exceeded.

https://serviceworke.rs/offline-status_demo.html

此错误仅在chrome中出现.它在Firefox中工作正常，而在Firefox中没有错误.

This error occurs only in chrome. It works fine in firefox without error in firefox.

服务工作者的安装事件中发生错误. 服务人员发布的代码在下面发布，以供参考.

The error occurs in the install event of the service worker. Code from the service worker in posted below for reference.

// /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的配额限制?

How to rectify this error? Is there a way to increase the quota limit in chrome?

链接表示: Chrome检查每个来源的配额限制，而firefox具有无限的配额.

This link says that the Chrome checks quota limit per origin whereas firefox has unlimited quota.

是否有办法删除从原点缓存的所有文件(重置为原始状态)?

Is there a way to delete all the files cached from the origin (reset to original state) ?

推荐答案

offline-status_demo仅下载700kb，因此不能单独超过5MB的Chrome配额限制.除非Chrome缓存已满-否则 打开标签过多.

The offline-status_demo downloads merely 700kb and hence can't exceed the 5MB Chrome quota limit on its own. Unless Chrome Cache is already full - as would be the case if you have too many open tabs.

答案:以隐身模式重试.

Answer: try again in incognito mode.

这篇关于未捕获(承诺)DOMException:超出配额的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！