Files
picpeak/frontend/public/bootstrap.js
T
Paul Nothaft dcc629cad2 fix(csp): external bootstrap script to survive strict reverse-proxy CSP (#564)
demo.picpeak.app sits behind Caddy + Cloudflare; Caddy replaces the
nginx CSP entirely with one that omits 'unsafe-inline' / hash / nonce,
so the #358 inline theme-bootstrap was being blocked there — admin
loaded a black page, the SPA bundle 404'd, link buttons did nothing.

Move the bootstrap to /public/bootstrap.js served as 'self' so the
script runs under every reasonable CSP without further coordination.
Vite copies /public/* to the dist root at build time (same pipeline
as /favicon-32x32.png), and it remains in <head> without defer/async
so it still runs before <body> paints. The OS-preference @media CSS
above still handles the first-frame dark/light baseline.
2026-05-31 22:35:00 +02:00

33 lines
1.2 KiB
JavaScript

/*
* Pre-React theme bootstrap (#358).
*
* Loaded as an external script (rather than inline) so a strict CSP
* with no 'unsafe-inline' / hash / nonce — like the one Caddy puts in
* front of demo.picpeak.app — does not block it (#564).
*
* Reads the per-gallery cached background written by ThemeContext on
* the previous visit and applies it before React mounts, so revisits
* land on the right colour from the first frame. The OS-preference
* default is already handled by the @media CSS in index.html for
* first-visit / cache-miss callers.
*
* Placed in /public so vite copies it to /bootstrap.js at build time
* (same pipeline as /favicon-32x32.png). Kept in <head> without
* defer/async so it runs before <body> paints.
*/
(function () {
try {
var m = location.pathname.match(/\/gallery\/([^\/?#]+)/);
var bg = null;
if (m && m[1]) {
bg = localStorage.getItem('gallery-theme-bg-' + decodeURIComponent(m[1]));
}
if (bg) {
var root = document.documentElement;
root.style.backgroundColor = bg;
document.body && (document.body.style.backgroundColor = bg);
root.style.setProperty('--color-background', bg);
}
} catch (e) { /* never block render on a cache miss */ }
})();