I can't find this infomration. How to use importScripts that will work after the page is down and refreshed after a while?
I have this code:
self.addEventListener('install', function(evt) {
self.skipWaiting();
self.importScripts('https://cdn.jsdelivr.net/npm/idb-keyval/dist/umd.js');
});
I've also tried:
self.addEventListener('install', function(event) {
event.waitUntil(
self.importScripts('https://cdn.jsdelivr.net/npm/idb-keyval/dist/umd.js')
);
});
self.addEventListener('activate', (event) => {
event.waitUntil(
self.importScripts('https://cdn.jsdelivr.net/npm/idb-keyval/dist/umd.js')
);
});
and when I open the site after a few minutes, I've got error about missing library.
What is the proper way to load a file with importScripts that will work? I just want to keep using this library.
I can't find this information anywhere, there are no much examples how to use external libraries in service workers.
It doesn't have to be importScripts but this it the only way I know to import external file in Service Worker. I'm not sure if you have use ES Modules for that.
EDIT:
I've also tried this:
self.addEventListener('install', function(event) {
self.skipWaiting();
self.importScripts('https://cdn.jsdelivr.net/npm/idb-keyval/dist/umd.js');
self.idb = idbKeyval;
});
self.addEventListener('activate', function(event) {
if (!self.idb) {
self.skipWaiting();
self.importScripts('https://cdn.jsdelivr.net/npm/idb-keyval/dist/umd.js');
self.idb = idbKeyval;
}
});
I've set break point in activate event and it was not executed at all the same as install and my variable got removed.
I was testing by stopping the service worker in dev tools and refresh. Each time got error about missing idb.
I've also tried using local let variable in the service worker, got the same results idb is undefined, after service worker was stopped.
EDIT2:
I've asked the author on GitHub, since this may be issue with the library.
What is the proper way to load a file with importScripts that will work? I just want to keep using this library.
You would usually use importScripts in the global scope of the service worker, outside of any event callbacks:
importScripts('https://cdn.jsdelivr.net/npm/idb-keyval/dist/umd.js');
self.addEventListener('install', function (evt) {
// your install handler
// `self.idbKeyval` should be available here, as well as anywhere else
});