无法在“缓存”上执行“放置”：不支持请求方法“POST” - PWA Service Worker

问题描述

我正在创建一个带有 react 的 PWA。尽管它通过了灯塔测试并且可以安装，但我一直在控制台中看到这两个错误。当我浏览应用程序时，这些错误被记录了很多次。

Uncaught (in promise) TypeError: Failed to execute 'put' on 'Cache': Request method 'POST' is unsupported
        at Cache.put (<anonymous>)
        at worker.js:20

Uncaught (in promise) TypeError: Failed to execute 'put' on 'Cache': Request scheme 'chrome-extension' is unsupported
        at Cache.put (<anonymous>)
        at worker.js:20

第 20 行是 cache.put(event.request,resClone);

这是我的 worker.js 文件中的代码

const CACHE_NAME = 'My App';

// Install a service worker
self.addEventListener('install',event => {
    console.log('Opened cache');
});

// Cache and return request
self.addEventListener('fetch',event => {
    event.respondWith(
        fetch(event.request).then(res => {
            const resClone = res.clone();
            caches
                .open(CACHE_NAME)
                .then(cache => {
                    cache.put(event.request,resClone);
                });
            return res;
        }).catch(err => caches.match(event.request).then(res => res))
    );
});

// Update a service worker
self.addEventListener('activate',event => {
    const cacheWhitelist = [];
    cacheWhitelist.push(CACHE_NAME);

    event.waitUntil(
        caches.keys().then((cacheNames) => Promise.all(
            cacheNames.map((cacheName) => {
                if (!cacheWhitelist.includes(cacheName)) {
                    return caches.delete(cacheName);
                }
            })
        ))
    );
});

解决方法

暂无找到可以解决该程序问题的有效方法，小编努力寻找整理中！

如果你已经找到好的解决方法，欢迎将解决方案带上本链接一起发送给小编。

小编邮箱:dio#foxmail.com (将#修改为@）