133 lines
4.6 KiB
JavaScript
133 lines
4.6 KiB
JavaScript
(function () {
|
|
'use strict';
|
|
|
|
var script = document.currentScript || (function () {
|
|
var scripts = document.getElementsByTagName('script');
|
|
return scripts[scripts.length - 1] || null;
|
|
})();
|
|
var service = script && script.dataset ? script.dataset.service : '';
|
|
var endpoint = script && script.dataset && script.dataset.endpoint
|
|
? script.dataset.endpoint
|
|
: new URL('../asset-version.php', script ? script.src : window.location.href).toString();
|
|
var interval = script && script.dataset && script.dataset.interval ? Number(script.dataset.interval) : 30000;
|
|
|
|
if (!service || window.__assetReloadStarted) return;
|
|
|
|
window.__assetReloadStarted = true;
|
|
interval = Math.max(15000, Number.isFinite(interval) ? interval : 30000);
|
|
|
|
var storageKey = 'assetVersion:' + service;
|
|
var reloadKey = 'assetReload:' + service;
|
|
var running = false;
|
|
|
|
function addQuery(url, key, value) {
|
|
var parsed = new URL(url, window.location.href);
|
|
parsed.searchParams.set(key, value);
|
|
return parsed.toString();
|
|
}
|
|
|
|
function sameOriginUrl(url) {
|
|
try {
|
|
var parsed = new URL(url, window.location.href);
|
|
return parsed.origin === window.location.origin ? parsed : null;
|
|
} catch (e) {
|
|
return null;
|
|
}
|
|
}
|
|
|
|
function addAssetToken(element, attr, token) {
|
|
var current = element && element.getAttribute(attr);
|
|
var parsed = current ? sameOriginUrl(current) : null;
|
|
if (!parsed || parsed.searchParams.get('assetReload') === token) return;
|
|
|
|
parsed.searchParams.set('assetReload', token);
|
|
element.setAttribute(attr, parsed.pathname + parsed.search + parsed.hash);
|
|
}
|
|
|
|
function applyAssetToken(token) {
|
|
if (!token) return;
|
|
|
|
document.querySelectorAll('script[src]').forEach(function (element) {
|
|
addAssetToken(element, 'src', token);
|
|
});
|
|
document.querySelectorAll('link[href]').forEach(function (element) {
|
|
var rel = (element.getAttribute('rel') || '').toLowerCase();
|
|
if (rel.indexOf('stylesheet') === -1 && rel.indexOf('icon') === -1 && rel.indexOf('manifest') === -1) return;
|
|
addAssetToken(element, 'href', token);
|
|
});
|
|
}
|
|
|
|
var currentAssetToken = new URL(window.location.href).searchParams.get('assetReload') || '';
|
|
if (currentAssetToken) {
|
|
applyAssetToken(currentAssetToken);
|
|
new MutationObserver(function () {
|
|
applyAssetToken(currentAssetToken);
|
|
}).observe(document.documentElement, { childList: true, subtree: true });
|
|
}
|
|
|
|
function deleteCaches() {
|
|
if (!window.caches || !window.caches.keys) return Promise.resolve();
|
|
|
|
return window.caches.keys().then(function (keys) {
|
|
return Promise.all(keys.map(function (key) {
|
|
return window.caches.delete(key);
|
|
}));
|
|
}).catch(function () {});
|
|
}
|
|
|
|
function reloadWith(version) {
|
|
var token = version.slice(0, 12);
|
|
var marker = token + ':' + Math.floor(Date.now() / 10000);
|
|
|
|
if (sessionStorage.getItem(reloadKey) === marker) return;
|
|
|
|
sessionStorage.setItem(reloadKey, marker);
|
|
deleteCaches().then(function () {
|
|
window.location.replace(addQuery(window.location.href, 'assetReload', token));
|
|
});
|
|
}
|
|
|
|
function check(force) {
|
|
if (running || (!force && document.hidden)) return;
|
|
|
|
running = true;
|
|
fetch(addQuery(endpoint, '_', String(Date.now())), {
|
|
cache: 'no-store',
|
|
credentials: 'same-origin',
|
|
headers: {
|
|
'Cache-Control': 'no-cache',
|
|
'Pragma': 'no-cache'
|
|
}
|
|
}).then(function (response) {
|
|
if (!response.ok) throw new Error('asset version request failed');
|
|
return response.json();
|
|
}).then(function (data) {
|
|
if (!data || data.result !== 'ok' || !data.version) return;
|
|
|
|
var previous = localStorage.getItem(storageKey);
|
|
localStorage.setItem(storageKey, data.version);
|
|
|
|
if (previous && previous !== data.version) {
|
|
reloadWith(data.version);
|
|
}
|
|
}).catch(function () {}).finally(function () {
|
|
running = false;
|
|
});
|
|
}
|
|
|
|
window.addEventListener('pageshow', function () {
|
|
check(true);
|
|
});
|
|
window.addEventListener('focus', function () {
|
|
check(true);
|
|
});
|
|
document.addEventListener('visibilitychange', function () {
|
|
if (!document.hidden) check(true);
|
|
});
|
|
|
|
setInterval(function () {
|
|
check(false);
|
|
}, interval);
|
|
check(true);
|
|
})();
|