Archived
1
0

Register a service worker

To make installing as a PWA possible. Fixes #1181.
This commit is contained in:
Asher
2020-02-27 14:56:14 -06:00
parent eef2ed0e78
commit 963ebaca5b
17 changed files with 140 additions and 78 deletions

View File

@ -12,7 +12,7 @@
"sizes": "96x96"
},
{
"src": "/{{BASE}}/static-{{COMMIT}}/src/browser/media/pwa-icon-128.png",
"src": "{{BASE}}/static-{{COMMIT}}/src/browser/media/pwa-icon-128.png",
"type": "image/png",
"sizes": "128x128"
},

View File

@ -19,6 +19,7 @@
<meta id="coder-options" data-settings="{{OPTIONS}}" />
</head>
<body>
<script src="{{BASE}}/static-{{COMMIT}}/dist/register.js"></script>
<script src="{{BASE}}/static-{{COMMIT}}/dist/app.js"></script>
</body>
</html>

View File

@ -8,8 +8,5 @@ import "./login.css"
import "./update.css"
const options = getOptions()
const parts = window.location.pathname.replace(/^\//g, "").split("/")
parts[parts.length - 1] = options.base
const url = new URL(window.location.origin + "/" + parts.join("/"))
console.log(url)
console.log(options)

View File

@ -16,6 +16,7 @@
/>
<link rel="apple-touch-icon" href="{{BASE}}/static-{{COMMIT}}/src/browser/media/code-server.png" />
<link href="{{BASE}}/static-{{COMMIT}}/dist/app.css" rel="stylesheet" />
<meta id="coder-options" data-settings="{{OPTIONS}}" />
</head>
<body>
<div class="center-container">
@ -29,5 +30,6 @@
</div>
</div>
</div>
<script src="{{BASE}}/static-{{COMMIT}}/dist/register.js"></script>
</body>
</html>

View File

@ -60,5 +60,6 @@
</div>
</div>
</div>
<script src="{{BASE}}/static-{{COMMIT}}/dist/register.js"></script>
</body>
</html>

View File

@ -8,7 +8,7 @@
/>
<meta
http-equiv="Content-Security-Policy"
content="style-src 'self'; script-src 'unsafe-inline'; manifest-src 'self'; img-src 'self' data:;"
content="style-src 'self'; script-src 'self' 'unsafe-inline'; manifest-src 'self'; img-src 'self' data:;"
/>
<title>code-server login</title>
<link rel="icon" href="{{BASE}}/static-{{COMMIT}}/src/browser/media/favicon.ico" type="image/x-icon" />
@ -19,6 +19,7 @@
/>
<link rel="apple-touch-icon" href="{{BASE}}/static-{{COMMIT}}/src/browser/media/code-server.png" />
<link href="{{BASE}}/static-{{COMMIT}}/dist/app.css" rel="stylesheet" />
<meta id="coder-options" data-settings="{{OPTIONS}}" />
</head>
<body>
<div class="center-container">
@ -52,6 +53,7 @@
</div>
</div>
</body>
<script src="{{BASE}}/static-{{COMMIT}}/dist/register.js"></script>
<script>
const parts = window.location.pathname.replace(/^\//g, "").split("/")
parts[parts.length - 1] = "{{BASE}}"

View File

@ -16,6 +16,7 @@
/>
<link rel="apple-touch-icon" href="{{BASE}}/static-{{COMMIT}}/src/browser/media/code-server.png" />
<link href="{{BASE}}/static-{{COMMIT}}/dist/app.css" rel="stylesheet" />
<meta id="coder-options" data-settings="{{OPTIONS}}" />
</head>
<body>
<div class="center-container">
@ -32,5 +33,6 @@
</div>
</div>
</div>
<script src="{{BASE}}/static-{{COMMIT}}/dist/register.js"></script>
</body>
</html>

View File

@ -41,6 +41,8 @@
<!-- PROD_ONLY
<link rel="prefetch" href="{{VS_BASE}}/static-{{COMMIT}}/node_modules/semver-umd/lib/semver-umd.js">
END_PROD_ONLY -->
<meta id="coder-options" data-settings="{{OPTIONS}}" />
</head>
<body aria-label=""></body>
@ -91,6 +93,7 @@
"vs/nls": nlsConfig,
}
</script>
<script src="{{BASE}}/static-{{COMMIT}}/dist/register.js"></script>
<script src="{{VS_BASE}}/static-{{COMMIT}}/out/vs/loader.js"></script>
<!-- PROD_ONLY
<script src="{{VS_BASE}}/static-{{COMMIT}}/out/vs/workbench/workbench.web.api.nls.js"></script>

14
src/browser/register.ts Normal file
View File

@ -0,0 +1,14 @@
import { getOptions, normalize } from "../common/util"
const options = getOptions()
if ("serviceWorker" in navigator) {
const path = normalize(`${options.base}/static-${options.commit}/dist/serviceWorker.js`)
navigator.serviceWorker
.register(path, {
scope: options.base || "/",
})
.then(function() {
console.log("[Service Worker] registered")
})
}

View File

@ -0,0 +1,24 @@
/* eslint-disable @typescript-eslint/no-explicit-any */
self.addEventListener("install", () => {
console.log("[Service Worker] install")
})
self.addEventListener("activate", (event: any) => {
event.waitUntil((self as any).clients.claim())
})
self.addEventListener("fetch", (event: any) => {
if (!navigator.onLine) {
event.respondWith(
new Promise((resolve) => {
resolve(
new Response("OFFLINE", {
status: 200,
statusText: "OK",
}),
)
}),
)
}
})