midgard/MapComplete
1
0
Fork 0
forked from MapComplete/MapComplete
Code Pull requests Activity

Fix service worker

Browse source
This commit is contained in:
pietervdvn 2022-06-02 02:59:34 +02:00
parent ed6f0cf84b
commit ea1e7e62ef
8 changed files with 149 additions and 102 deletions
Show stats Download patch file Download diff file Expand all files Collapse all files

5
Models/Constants.ts
View file

@ -1,5 +1,3 @@
import {Utils} from "../Utils";
export default class Constants {
public static vNumber = "0.20.0";
@ -72,9 +70,6 @@ export default class Constants {
static countryCoderEndpoint: string = "https://raw.githubusercontent.com/pietervdvn/MapComplete-data/main/latlon2country";
private static isRetina(): boolean {
if (Utils.runningFromConsole) {
return;
}
// The cause for this line of code: https://github.com/pietervdvn/MapComplete/issues/115
// See https://stackoverflow.com/questions/19689715/what-is-the-best-way-to-detect-retina-support-on-a-device-using-javascript
return ((window.matchMedia && (window.matchMedia('only screen and (min-resolution: 192dpi), only screen and (min-resolution: 2dppx), only screen and (min-resolution: 75.6dpcm)').matches || window.matchMedia('only screen and (-webkit-min-device-pixel-ratio: 2), only screen and (-o-min-device-pixel-ratio: 2/1), only screen and (min--moz-device-pixel-ratio: 2), only screen and (min-device-pixel-ratio: 2)').matches)) || (window.devicePixelRatio && window.devicePixelRatio >= 2));

2
UI/DefaultGUI.ts
View file

@ -55,6 +55,8 @@ export default class DefaultGUI {
if (this.state.layoutToUse.customCss !== undefined && window.location.pathname.indexOf("index") >= 0) {
Utils.LoadCustomCss(this.state.layoutToUse.customCss)
}
Utils.downloadJson("./service-worker-version").then(data => console.log("Service worker", data)).catch(e => console.log("Service worker not active"))
}
public setupClickDialogOnMap(filterViewIsOpened: UIEventSource<boolean>, state: FeaturePipelineState) {

5
index.html
View file

@ -82,13 +82,12 @@
<script>
window.addEventListener('load', () => {
if ('serviceWorker' in navigator) {
// register service worker
navigator.serviceWorker.register('/service-worker.js').then(
() => {
console.log('SW registration successful');
console.log('Service worker registration successful');
},
err => {
console.error('SW registration failed', err)
console.error('Service worker registration failed', err)
});
} else {
console.log("Service workers are not supported")

79
package-lock.json generated
View file

@ -26,6 +26,7 @@
"@types/prompt-sync": "^4.1.0",
"@types/wikidata-sdk": "^6.1.0",
"@types/xml2js": "^0.4.9",
"core-js": "^3.22.8",
"country-language": "^0.1.7",
"doctest-ts-improved": "^0.8.6",
"email-validator": "^2.0.4",
@ -1128,6 +1129,14 @@
"regenerator-runtime": "^0.13.4"
}
},
"node_modules/@babel/polyfill/node_modules/core-js": {
"version": "2.6.12",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
"deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.",
"dev": true,
"hasInstallScript": true
},
"node_modules/@babel/preset-env": {
"version": "7.13.8",
"resolved": "https://registry.npmjs.org/@babel/preset-env/-/preset-env-7.13.8.tgz",
@ -3850,6 +3859,13 @@
"regenerator-runtime": "^0.11.0"
}
},
"node_modules/babel-runtime/node_modules/core-js": {
"version": "2.6.12",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
"deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.",
"hasInstallScript": true
},
"node_modules/babel-runtime/node_modules/regenerator-runtime": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
@ -4879,11 +4895,14 @@
}
},
"node_modules/core-js": {
"version": "2.6.12",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
"deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.",
"hasInstallScript": true
"version": "3.22.8",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.22.8.tgz",
"integrity": "sha512-UoGQ/cfzGYIuiq6Z7vWL1HfkE9U9IZ4Ub+0XSiJTCzvbZzgPA69oDF2f+lgJ6dFFLEdjW5O6svvoKzXX23xFkA==",
"hasInstallScript": true,
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/core-js"
}
},
"node_modules/core-js-compat": {
"version": "3.12.0",
@ -8941,17 +8960,6 @@
"html2canvas": "^1.0.0-rc.5"
}
},
"node_modules/jspdf/node_modules/core-js": {
"version": "3.15.2",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.15.2.tgz",
"integrity": "sha512-tKs41J7NJVuaya8DxIOCnl8QuPHx5/ZVbFo1oKgVl1qHFBBrDctzQGtuLjPpRdNTWmKPH6oEvgN/MUID+l485Q==",
"hasInstallScript": true,
"optional": true,
"funding": {
"type": "opencollective",
"url": "https://opencollective.com/core-js"
}
},
"node_modules/jsprim": {
"version": "1.4.2",
"resolved": "https://registry.npmjs.org/jsprim/-/jsprim-1.4.2.tgz",
@ -10558,6 +10566,13 @@
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
"integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
},
"node_modules/parcel/node_modules/core-js": {
"version": "2.6.12",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
"deprecated": "core-js@<3.4 is no longer maintained and not recommended for usage due to the number of issues. Because of the V8 engine whims, feature detection in old core-js versions could cause a slowdown up to 100x even if nothing is polyfilled. Please, upgrade your dependencies to the actual version of core-js.",
"hasInstallScript": true
},
"node_modules/parcel/node_modules/fast-glob": {
"version": "2.2.7",
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-2.2.7.tgz",
@ -17493,6 +17508,14 @@
"requires": {
"core-js": "^2.6.5",
"regenerator-runtime": "^0.13.4"
},
"dependencies": {
"core-js": {
"version": "2.6.12",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ==",
"dev": true
}
}
},
"@babel/preset-env": {
@ -19703,6 +19726,11 @@
"regenerator-runtime": "^0.11.0"
},
"dependencies": {
"core-js": {
"version": "2.6.12",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
},
"regenerator-runtime": {
"version": "0.11.1",
"resolved": "https://registry.npmjs.org/regenerator-runtime/-/regenerator-runtime-0.11.1.tgz",
@ -20542,9 +20570,9 @@
"integrity": "sha1-Z29us8OZl8LuGsOpJP1hJHSPV40="
},
"core-js": {
"version": "2.6.12",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
"version": "3.22.8",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.22.8.tgz",
"integrity": "sha512-UoGQ/cfzGYIuiq6Z7vWL1HfkE9U9IZ4Ub+0XSiJTCzvbZzgPA69oDF2f+lgJ6dFFLEdjW5O6svvoKzXX23xFkA=="
},
"core-js-compat": {
"version": "3.12.0",
@ -23677,14 +23705,6 @@
"dompurify": "^2.2.0",
"fflate": "^0.4.8",
"html2canvas": "^1.0.0-rc.5"
},
"dependencies": {
"core-js": {
"version": "3.15.2",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-3.15.2.tgz",
"integrity": "sha512-tKs41J7NJVuaya8DxIOCnl8QuPHx5/ZVbFo1oKgVl1qHFBBrDctzQGtuLjPpRdNTWmKPH6oEvgN/MUID+l485Q==",
"optional": true
}
}
},
"jsprim": {
@ -24978,6 +24998,11 @@
"resolved": "https://registry.npmjs.org/commander/-/commander-2.20.3.tgz",
"integrity": "sha512-GpVkmM8vF2vQUkj2LvZmD35JxeJOLCwJ9cUkugyk2nuhbv3+mJvpLYYt+0+USMxE+oj+ey/lJEnhZw75x/OMcQ=="
},
"core-js": {
"version": "2.6.12",
"resolved": "https://registry.npmjs.org/core-js/-/core-js-2.6.12.tgz",
"integrity": "sha512-Kb2wC0fvsWfQrgk8HU5lW6U/Lcs8+9aaYcy4ZFc6DDlo4nZ7n70dEgE5rtR0oG6ufKDUnrwfWL1mXR5ljDatrQ=="
},
"fast-glob": {
"version": "2.2.7",
"resolved": "https://registry.npmjs.org/fast-glob/-/fast-glob-2.2.7.tgz",

7
package.json
View file

@ -34,6 +34,7 @@
"generate:report": "cd Docs/Tools && ./compileStats.sh && git commit . -m 'New statistics ands graphs' && git push",
"generate:contributor-list": "ts-node scripts/generateContributors.ts",
"generate:schemas": "ts2json-schema -p Models/ThemeConfig/Json/ -o Docs/Schemas/ -t tsconfig.json -R . -m \".*ConfigJson\" && ts-node scripts/fixSchemas.ts ",
"generate:service-worker": "tsc service-worker.ts",
"optimize-images": "cd assets/generated/ && find -name '*.png' -exec optipng '{}' \\; && echo 'PNGs are optimized'",
"reset:layeroverview": "echo {\\\"layers\\\":[], \\\"themes\\\":[]} > ./assets/generated/known_layers_and_themes.json && echo {\\\"layers\\\": []} > ./assets/generated/known_layers.json",
"generate": "mkdir -p ./assets/generated && npm run reset:layeroverview && npm run generate:images && npm run generate:charging-stations && npm run generate:translations && npm run generate:licenses && npm run generate:layeroverview",
@ -55,6 +56,12 @@
],
"author": "pietervdvn",
"license": "GPL",
"browserslist": [
">0.2%",
"not dead",
"not ie < 11",
"not op_mini all"
],
"dependencies": {
"@babel/preset-env": "7.13.8",
"@parcel/service-worker": "^2.6.0",

65
service-worker.js
View file

@ -1,65 +0,0 @@
import {manifest, version} from '@parcel/service-worker';
async function install() {
console.log("Installing service worker!")
const cache = await caches.open(version);
console.log("Manifest file", manifest)
// await cache.addAll(manifest);
/* await cache.add({
cache: "force-cache",
url: "http://4.bp.blogspot.com/-_vTDmo_fSTw/T3YTV0AfGiI/AAAAAAAAAX4/Zjh2HaoU5Zo/s1600/beautiful%2Bkitten.jpg",
destination: "image",
})//*/
}
addEventListener('install', e => e.waitUntil(install()));
async function activate() {
console.log("Activating service worker")
/*self.registration.showNotification("SW started", {
actions: [{
action: "OK",
title: "Some action"
}]
})*/
const keys = await caches.keys();
await Promise.all(
keys.map(key => key !== version && caches.delete(key))
);
}
addEventListener('activate', e => e.waitUntil(activate()));
self.addEventListener('fetch', (event) => {
try {
if (event.request.url === "http://127.0.0.1:1234/somedata") {
console.log("Sending hi to 'somedata'")
event.respondWith(new Response("Service worker is active"))
return
}
const origin = new URL(self.origin)
const requestUrl = new URL(event.request.url)
console.log("Testing cache", origin.host, requestUrl.host, origin.host === requestUrl.host)
if (origin.host !== requestUrl.host) {
event.respondWith(fetch(event.request));
return
}
event.respondWith(
async () => {
const matched = caches.match(event.request)
if(matched){
return matched
}
const response = fetch(event.request);
const cache = await caches.open(version);
await cache.put(event.request.url, response);
console.log("Put ",event.request.url,"into the cache")
return response
}
);
} catch (e) {
console.error("CRASH IN SW:", e)
event.respondWith(fetch(event.request));
}
});

84
service-worker.ts Normal file
View file

@ -0,0 +1,84 @@
const version = "0.0.8"
interface ServiceWorkerFetchEvent extends Event {
request: RequestInfo & {url: string},
respondWith: ((response: any | PromiseLike<Response>) => Promise<void>)
}
async function install() {
console.log("Installing service worker!")
// const cache = await caches.open(version);
// console.log("Manifest file", manifest)
// await cache.addAll(manifest);
/* await cache.add({
cache: "force-cache",
url: "http://4.bp.blogspot.com/-_vTDmo_fSTw/T3YTV0AfGiI/AAAAAAAAAX4/Zjh2HaoU5Zo/s1600/beautiful%2Bkitten.jpg",
destination: "image",
})//*/
}
addEventListener('install', e => (<any>e).waitUntil(install()));
addEventListener('activate', e => (<any>e).waitUntil(activate()));
async function activate() {
console.log("Activating service worker")
/*self.registration.showNotification("SW started", {
actions: [{
action: "OK",
title: "Some action"
}]
})*/
caches.keys().then(keys => {
Promise.all(
keys.map(key => key !== version && caches.delete(key))
);
}).catch(console.error)
}
const cacheFirst = (event) => {
event.respondWith(
caches.match(event.request, {ignoreSearch: true}).then((cacheResponse) => {
if(cacheResponse !== undefined){
console.log("Loaded from cache: ", event.request)
return cacheResponse
}
return fetch(event.request).then((networkResponse) => {
networkResponse.headers.set("Cache-Control","max-age=")
return caches.open(version).then((cache) => {
cache.put(event.request, networkResponse.clone());
console.log("Cached", event.request)
return networkResponse;
})
})
})
)
};
self.addEventListener('fetch',
e => {
// Important: this lambda must run synchronously, as the browser will otherwise handle the request
const event = <ServiceWorkerFetchEvent> e;
try {
const origin = new URL(self.origin)
const requestUrl = new URL(event.request.url)
if (requestUrl.pathname.endsWith("service-worker-version")) {
console.log("Sending version number...")
event.respondWith(new Response(JSON.stringify({"service-worker-version": version})));
return
}
const shouldBeCached = origin.host === requestUrl.host && origin.host !== "127.0.0.1:1234"
if (!shouldBeCached) {
console.log("Not intercepting ", requestUrl.toString(), origin.host, requestUrl.host)
// We return _without_ calling event.respondWith, which signals the browser that it'll have to handle it himself
return
}
cacheFirst(event)
} catch (e) {
console.error("CRASH IN SW:", e)
event.respondWith(fetch(event.request.url));
}
});

4
theme.html
View file

@ -93,10 +93,10 @@
// register service worker
navigator.serviceWorker.register('/service-worker.js').then(
() => {
console.log('SW registration successful');
console.log('Service worker registration successful');
},
err => {
console.error('SW registration failed', err)
console.error('Service worker registration failed', err)
});
} else {
console.log("Service workers are not supported")