这是该站点（https://oninross.github.io/not-hotdog-pwa/），您可以在 Chrome 浏览器上查看它，它将执行离线缓存位。我在移动 Chrome 浏览器中查看了相同的链接，但它没有进行离线缓存位。没有 A2HS 提示。
我已经从以前有效的项目中复制了我的 SW 和 JS。现在它没有。任何想法为什么？
sw.js
var version = '0.0.0',
now = Date.now(),
OFFLINE_URL = './pages/offline/',
urlsToPrefetch = [
'./assets/not-hotdog-pwa/css/main.css',
'./assets/not-hotdog-pwa/js/main.js',
'./assets/not-hotdog-pwa/fonts/icomoon.woff',
'./assets/not-hotdog-pwa/models/output_labels.txt',
'./assets/not-hotdog-pwa/models/saved_model_web/tensorflowjs_model.pb',
'./assets/not-hotdog-pwa/models/saved_model_web/weights_manifest.json',
'./assets/not-hotdog-pwa/models/saved_model_web/group1-shard1of5',
'./assets/not-hotdog-pwa/models/saved_model_web/group1-shard2of5',
'./assets/not-hotdog-pwa/models/saved_model_web/group1-shard3of5',
'./assets/not-hotdog-pwa/models/saved_model_web/group1-shard4of5',
'./assets/not-hotdog-pwa/models/saved_model_web/group1-shard5of5',
'./manifest.json',
OFFLINE_URL,
'./index.html?homescreen=1'
],
CURRENT_CACHES = {
prefetch: 'prefetch-cache-v' + version
};
self.addEventListener('install', function (event) {
console.log('Handling install event. Resources to prefetch:', urlsToPrefetch);
event.waitUntil(
caches.open(CURRENT_CACHES.prefetch).then(function (cache) {
var cachePromises = urlsToPrefetch.map(function (urlToPrefetch) {
var url = new URL(urlToPrefetch, location.href);
url.search += (url.search ? '&' : '?') + 'cache-bust=' + now;
var request = new Request(url, { mode: 'no-cors' });
return fetch(request).then(function (response) {
if (response.status >= 400) {
throw new Error('request for ' + urlToPrefetch +
' failed with status ' + response.statusText);
}
return cache.put(urlToPrefetch, response);
}).catch(function (error) {
console.error('Not caching ' + urlToPrefetch + ' due to ' + error);
});
});
return Promise.all(cachePromises).then(function () {
console.log('Pre-fetching complete.');
});
}).then(function () {
return self.skipWaiting();
}).catch(function (error) {
console.error('Pre-fetching failed:', error);
})
);
});
self.addEventListener('activate', function (event) {
var expectedCacheNames = Object.keys(CURRENT_CACHES).map(function (key) {
return CURRENT_CACHES[key];
});
event.waitUntil(
caches.keys().then(function (cacheNames) {
return Promise.all(
cacheNames.map(function (cacheName) {
if (expectedCacheNames.indexOf(cacheName) === -1) {
console.log('Deleting out of date cache:', cacheName);
return caches.delete(cacheName);
}
})
);
})
);
});
self.addEventListener('fetch', function (event) {
console.log('Handling fetch event for', event.request.url);
event.respondWith(
caches.match(event.request).then(function (response) {
if (response) {
console.log('Found response in cache:', response);
return response;
}
console.log('No response found in cache. About to fetch from network...');
return fetch(event.request).then(function (response) {
console.log('Response from network is:', response);
return response;
}).catch(function (error) {
console.error('Fetching failed:', error);
return caches.match(OFFLINE_URL);
});
})
);
});
main.js
if ('serviceWorker' in navigator) {
window.addEventListener('load', function () {
navigator.serviceWorker.register('./service-worker.js', { scope: './' })
.then(function (registration) {
console.log('registered service worker');
registration.onupdatefound = function () {
// The updatefound event implies that registration.installing is set; see
// https://slightlyoff.github.io/ServiceWorker/spec/service_worker/index.html#service-worker-container-updatefound-event
const installingWorker = registration.installing;
installingWorker.onstatechange = function () {
switch (installingWorker.state) {
case 'installed':
if (!navigator.serviceWorker.controller) {
toaster('Caching complete!');
}
break;
case 'redundant':
throw Error('The installing service worker became redundant.');
}
};
};
})
.catch(function (whut) {
console.error('uh oh... ');
console.error(whut);
});
});
window.addEventListener('appinstalled', (evt) => {
console.log('User added to homescreen');
});
// Check to see if the service worker controlling the page at initial load
// has become redundant, since this implies there's a new service worker with fresh content.
if (navigator.serviceWorker && navigator.serviceWorker.controller) {
console.log("navigator.serviceWorker.controller.onstatechange:: " + navigator.serviceWorker.controller.onstatechange)
navigator.serviceWorker.controller.onstatechange = function (event) {
if (event.target.state === 'redundant') {
toaster('A new version of this app is available.', 0); // duration 0 indications shows the toast indefinitely.
}
};
}
}
清单.json
{
"lang": "en",
"name": "Not Hotdog PWA",
"short_name": "Not Hotdog PWA",
"description": "",
"start_url": "./index.html",
"display": "standalone",
"orientation": "portrait",
"background_color": "#ee0000",
"theme_color": "#ee0000",
"icons": [
{
"src": "./assets/not-hotdog-pwa/images/favicon/android-icon-36x36.png",
"sizes": "36x36",
"type": "image/png",
"density": "0.75"
},
{
"src": "./assets/not-hotdog-pwa/images/favicon/android-icon-48x48.png",
"sizes": "48x48",
"type": "image/png",
"density": "1.0"
},
{
"src": "./assets/not-hotdog-pwa/images/favicon/android-icon-72x72.png",
"sizes": "72x72",
"type": "image/png",
"density": "1.5"
},
{
"src": "./assets/not-hotdog-pwa/images/favicon/android-icon-96x96.png",
"sizes": "96x96",
"type": "image/png",
"density": "2.0"
},
{
"src": "./assets/not-hotdog-pwa/images/favicon/android-icon-144x144.png",
"sizes": "144x144",
"type": "image/png",
"density": "3.0"
},
{
"src": "./assets/not-hotdog-pwa/images/favicon/android-icon-192x192.png",
"sizes": "192x192",
"type": "image/png",
"density": "4.0"
}
]
}
