I'm building my web app offline first based on this video:
https://www.youtube.com/watch?v=cmGr0RszHc8
And I'm running into trouble with the service worker. Here is my sw.js code:
const FILES_TO_CACHE = [
"/js/app.js",
"/js/authenticate.js",
"/js/forms.js",
"/js/head-scripts.js",
"/js/remember.js",
"/js/style.js",
"/style/style.css",
"/index.html",
"/tracker/index.html",
"/assets/LongShineLogo.png",
"/assets/shineSolarLogo.png",
"/assets/ShineSunburst.png",
"/error/404.html",
"https://fonts.googleapis.com/css?family=Roboto",
"https://use.fontawesome.com/releases/v5.2.0/css/all.css"
];
const CACHE_NAME = "static-cache-v1";
// Caching files in the cache
self.addEventListener("install", event => {
event.waitUntil(
caches.open(CACHE_NAME)
.then(function(cache) {
return cache.addAll(FILES_TO_CACHE)
})
);
});
self.addEventListener("fetch", event => {
// Getting URL
const url = new URL(event.request.url);
// Responding from cache if possible. If not, respond with the network or other cached content
if (url.origin === location.origin && url.pathname === "/") {
event.respondWith(caches.match("/index.html"));
return;
} else if (url.pathname === "/tracker/") {
event.respondWith(caches.match("/tracker/index.html"));
return;
} else {
event.respondWith(caches.match("/error/404.html"));
}
event.respondWith(
caches.match(event.request)
.then(response => response || fetch(event.request))
);
});
The error message I'm getting is:
Uncaught (in promise) TypeError: Request failed
And it's throwing that error message after the service worker is successfully registered (based on a console.log during my initial install phase of my main javascript file), on line 1 of my service worker file. As you can see, line one is just me declaring the constant variable. I've tried putting a try catch block around everything I can think, but I still get an uncaught error.
How can I track this error down better?
-- EDIT --
So I have tracked down the error somewhat. Based on the second to last answer to this question: Uncaught (in promise) TypeError: Request failed
I painstakingly went through every url in the FILES_TO_CACHE array, and tracked the problem down to the /error/404.html page. I can't figure out what's wrong, because I've gone through three times and checked that the file exists, there is something in the file, and that I have the path right.
Any thoughts???