我正在使用Python Django和django-pwa
包构建一个简单的渐进式Web应用程序。我已经设置了所有内容,但离线功能不起作用。此时,已安装服务工作进程 (SW(,开发工具将应用程序识别为 PWA。但是当我在devtools->Application
中选中"离线"并重新加载网页时,出现"无互联网连接"错误。
以下是我的软件设置:
var staticCacheName = 'djangopwa-v1';
var filesToCache = [
'/',
'/x_offline/',
'/static/x_django_pwa/images/my_app_icon.jpg',
'/media/images/bfly1.2e16d0ba.fill-320x240.jpg',
];
// Cache on install
self.addEventListener("install", event => {
this.skipWaiting();
event.waitUntil(
caches.open(staticCacheName)
.then(cache => {
return cache.addAll(filesToCache);
})
)
});
// Clear cache on activate
self.addEventListener('activate', event => {
event.waitUntil(
caches.keys().then(cacheNames => {
return Promise.all(
cacheNames
.filter(cacheName => (cacheName.startsWith("djangopwa-v1")))
.filter(cacheName => (cacheName !== staticCacheName))
.map(cacheName => caches.delete(cacheName))
);
})
);
});
// Serve from Cache
self.addEventListener("fetch", event => {
event.respondWith(
caches.match(event.request)
.then(response => {
return response || fetch(event.request);
})
.catch(() => {
return caches.match('x_offline');
})
)
});
列出的设置与 django-pwa 存储库中的默认设置几乎相同当我第一次加载页面时,我看到也对 SW 中列出的 url 发出了请求,并且所有这些 url 的状态均为 200。在缓存存储中,我看到在SW中设置了路径的缓存。所以我不明白我做错了什么。
不确定这些附加信息是否有用,但是:当我将 SW 设置为离线并重新加载网页时,缓存存储空间为空。
问题出在存储库提供的设置中django-pwa
。他们不小心在scope
变量的末尾添加了符号,
,因此,如果您复制使用不正确的scope
设置(PWA_APP_SCOPE = '/',
(复制的设置,它会制动离线模式。我将与存储库管理员联系,以便为下一个用户解决问题。