Move serviceworker to workbox and fix SSE interference (#11538)
* Move serviceworker to workbox and fix SSE interference Instead of statically hardcoding every frontend asset, this uses a type-based approach to cache all js,css and manifest.json requests. This also fixes the issue that the service worker was interfering with EventSource because it was unconditionally handling all requests which this new implementation doesn't. Fixes: https://github.com/go-gitea/gitea/issues/11092 Fixes: https://github.com/go-gitea/gitea/issues/7372 * rethrow error instead of logging * await .register * Revert "rethrow error instead of logging" This reverts commit 043162ba1f18b98a4bf9635959fd28d16e839fc5. * improve comment * remove JSRenderer * add version-based cache invalidation * refactor * more refactor * remove comment * rename item to fit cache name Co-authored-by: guillep2k <18600385+guillep2k@users.noreply.github.com>tokarchuk/v1.17
silverwind
5 years ago
committed by
GitHub
parent
f6f49700cc
commit
88fe7b5a72
@ -1,83 +0,0 @@ |
||||
var STATIC_CACHE = 'static-cache-v1'; |
||||
var urlsToCache = [ |
||||
// js |
||||
'{{StaticUrlPrefix}}/fomantic/semantic.min.js?v={{MD5 AppVer}}', |
||||
'{{StaticUrlPrefix}}/js/clipboard.js', |
||||
'{{StaticUrlPrefix}}/js/gitgraph.js', |
||||
'{{StaticUrlPrefix}}/js/highlight.js', |
||||
'{{StaticUrlPrefix}}/js/index.js?v={{MD5 AppVer}}', |
||||
'{{StaticUrlPrefix}}/js/jquery.js?v={{MD5 AppVer}}', |
||||
'{{StaticUrlPrefix}}/js/swagger.js?v={{MD5 AppVer}}', |
||||
'{{StaticUrlPrefix}}/js/dropzone.js', |
||||
'{{StaticUrlPrefix}}/js/datetimepicker.js', |
||||
'{{StaticUrlPrefix}}/js/tribute.js', |
||||
'{{StaticUrlPrefix}}/vendor/plugins/codemirror/addon/mode/loadmode.js', |
||||
'{{StaticUrlPrefix}}/vendor/plugins/codemirror/mode/meta.js', |
||||
'{{StaticUrlPrefix}}/vendor/plugins/jquery.minicolors/jquery.minicolors.min.js', |
||||
'{{StaticUrlPrefix}}/vendor/plugins/simplemde/simplemde.min.js', |
||||
|
||||
// css |
||||
'{{StaticUrlPrefix}}/css/index.css?v={{MD5 AppVer}}', |
||||
'{{StaticUrlPrefix}}/css/swagger.css?v={{MD5 AppVer}}', |
||||
'{{StaticUrlPrefix}}/css/dropzone.css', |
||||
'{{StaticUrlPrefix}}/css/datetimepicker.css', |
||||
'{{StaticUrlPrefix}}/fomantic/semantic.min.css?v={{MD5 AppVer}}', |
||||
'{{StaticUrlPrefix}}/vendor/assets/font-awesome/css/font-awesome.min.css', |
||||
'{{StaticUrlPrefix}}/vendor/plugins/jquery.minicolors/jquery.minicolors.css', |
||||
'{{StaticUrlPrefix}}/vendor/plugins/simplemde/simplemde.min.css', |
||||
{{if .IsSigned }} |
||||
{{ if ne .SignedUser.Theme "gitea" }} |
||||
'{{StaticUrlPrefix}}/css/theme-{{.SignedUser.Theme}}.css?v={{MD5 AppVer}}', |
||||
{{end}} |
||||
{{else if ne DefaultTheme "gitea"}} |
||||
'{{StaticUrlPrefix}}/css/theme-{{DefaultTheme}}.css?v={{MD5 AppVer}}', |
||||
{{end}} |
||||
|
||||
// img |
||||
'{{StaticUrlPrefix}}/img/gitea-sm.png', |
||||
'{{StaticUrlPrefix}}/img/gitea-lg.png', |
||||
|
||||
// svg |
||||
'{{StaticUrlPrefix}}/img/svg/icons.svg', |
||||
|
||||
// fonts |
||||
'{{StaticUrlPrefix}}/fomantic/themes/default/assets/fonts/icons.woff2', |
||||
'{{StaticUrlPrefix}}/vendor/assets/roboto-fonts/roboto-v20-latin-ext_cyrillic-ext_latin_greek_vietnamese_cyrillic_greek-ext-regular.woff2', |
||||
'{{StaticUrlPrefix}}/vendor/assets/roboto-fonts/roboto-v20-latin-ext_cyrillic-ext_latin_greek_vietnamese_cyrillic_greek-ext-italic.woff2', |
||||
'{{StaticUrlPrefix}}/vendor/assets/roboto-fonts/roboto-v20-latin-ext_cyrillic-ext_latin_greek_vietnamese_cyrillic_greek-ext-700.woff2', |
||||
'{{StaticUrlPrefix}}/vendor/assets/roboto-fonts/roboto-v20-latin-ext_cyrillic-ext_latin_greek_vietnamese_cyrillic_greek-ext-700italic.woff2', |
||||
|
||||
// monaco |
||||
'{{StaticUrlPrefix}}/css/monaco.css', |
||||
'{{StaticUrlPrefix}}/fonts/codicon.ttf', |
||||
'{{StaticUrlPrefix}}/js/monaco-css.worker.js', |
||||
'{{StaticUrlPrefix}}/js/monaco-editor.worker.js', |
||||
'{{StaticUrlPrefix}}/js/monaco-html.worker.js', |
||||
'{{StaticUrlPrefix}}/js/monaco-json.worker.js', |
||||
'{{StaticUrlPrefix}}/js/monaco.js', |
||||
'{{StaticUrlPrefix}}/js/monaco-ts.worker.js' |
||||
]; |
||||
|
||||
self.addEventListener('install', function (event) { |
||||
// Perform install steps |
||||
event.waitUntil( |
||||
caches.open(STATIC_CACHE) |
||||
.then(function (cache) { |
||||
return cache.addAll(urlsToCache); |
||||
}) |
||||
); |
||||
}); |
||||
|
||||
self.addEventListener('fetch', function (event) { |
||||
event.respondWith( |
||||
caches.match(event.request) |
||||
.then(function (response) { |
||||
// Cache hit - return response |
||||
if (response) { |
||||
return response; |
||||
} |
||||
return fetch(event.request); |
||||
} |
||||
) |
||||
); |
||||
}); |
||||
@ -0,0 +1,43 @@ |
||||
const {UseServiceWorker, AppSubUrl, AppVer} = window.config; |
||||
const cacheName = 'static-cache-v2'; |
||||
|
||||
async function unregister() { |
||||
for (const registration of await navigator.serviceWorker.getRegistrations()) { |
||||
const serviceWorker = registration.active; |
||||
if (!serviceWorker) continue; |
||||
registration.unregister(); |
||||
} |
||||
} |
||||
|
||||
async function invalidateCache() { |
||||
await caches.delete(cacheName); |
||||
} |
||||
|
||||
async function checkCacheValidity() { |
||||
const cacheKey = AppVer; |
||||
const storedCacheKey = localStorage.getItem('staticCacheKey'); |
||||
|
||||
// invalidate cache if it belongs to a different gitea version
|
||||
if (cacheKey && storedCacheKey !== cacheKey) { |
||||
invalidateCache(); |
||||
localStorage.setItem('staticCacheKey', cacheKey); |
||||
} |
||||
} |
||||
|
||||
export default async function initServiceWorker() { |
||||
if (!('serviceWorker' in navigator)) return; |
||||
|
||||
if (UseServiceWorker) { |
||||
await checkCacheValidity(); |
||||
try { |
||||
await navigator.serviceWorker.register(`${AppSubUrl}/serviceworker.js`); |
||||
} catch (err) { |
||||
console.error(err); |
||||
await invalidateCache(); |
||||
await unregister(); |
||||
} |
||||
} else { |
||||
await invalidateCache(); |
||||
await unregister(); |
||||
} |
||||
} |
||||
@ -0,0 +1,16 @@ |
||||
import {registerRoute} from 'workbox-routing'; |
||||
import {StaleWhileRevalidate} from 'workbox-strategies'; |
||||
|
||||
const cacheName = 'static-cache-v2'; |
||||
|
||||
const cachedDestinations = new Set([ |
||||
'manifest', |
||||
'script', |
||||
'style', |
||||
'worker', |
||||
]); |
||||
|
||||
registerRoute( |
||||
({request}) => cachedDestinations.has(request.destination), |
||||
new StaleWhileRevalidate({cacheName}), |
||||
); |
||||
Loading…
Reference in new issue