Question

我正在为自己的网站开发pwa，并将所有资产存储到缓存存储中。问题是当检查开发人员工具->应用程序->缓存存储可以并保存，但是转到其他页面并切换到开发工具上的离线mod时，缓存存储无法加载！

仅为保存的同一页面加载缓存存储数据？其他页面无法访问其他页面的缓存存储？

 event.respondWith(
        fetch(request)
            .then(res => { // onLine
                if (request.method == 'GET') {
                    // add to cache
                    caches.open(DYNAMIC_STATIC_CACHE_NAME_VERSION)
                        .then(cache => {
                            // console.log("save to dynamic cache");
                            cache.put(request, res);
                        })
                        .catch(() => console.log("error on dynamic cache open!"));
                }
                return res.clone();
            })
            .catch(err => {
                console.log("user is offline");

                if (request.mode === 'navigate' ||
                    (request.method === 'GET' && request.headers.get('accept').includes('text/html'))
                ) {
                    return caches.match(request) || caches.match(offlineUrl);
                }
                return caches.match(request) || fetch(request);
            });

Answer 1

同一域上的页面共享缓存API（以及IndexedDB，LocalStorage等）数据。

因此，不同域上的页面无法访问彼此的Cache API数据-这是一种安全机制。

其他页面上的PWA缓存存储不起作用？

1 个答案: