Add cache-busting ?v= to template CSS/JS, bump version

All static asset references now include ?v={{ version }} to force
browser to reload on deploy instead of serving cached versions.
Increment TEMPLATE_VERSION in server.py on each deploy.
This commit is contained in:
2026-06-16 18:30:07 -04:00
parent a7d8a27975
commit 3b1bb43895
2 changed files with 10 additions and 4 deletions
+6
View File
@@ -49,6 +49,10 @@ from ..midi.handler import MIDIHandler
logger = logging.getLogger(__name__) logger = logging.getLogger(__name__)
# ── Cache buster version (bumped on deploy) ─────────────────────────
# Increment this when template/static changes need to bypass browser cache
TEMPLATE_VERSION = "7"
# ── Defaults ───────────────────────────────────────────────────────────────── # ── Defaults ─────────────────────────────────────────────────────────────────
DEFAULT_HOST = "0.0.0.0" DEFAULT_HOST = "0.0.0.0"
@@ -312,6 +316,8 @@ class WebServer:
def _build_app(self) -> FastAPI: def _build_app(self) -> FastAPI:
templates = Jinja2Templates(directory=str(TEMPLATES_DIR)) templates = Jinja2Templates(directory=str(TEMPLATES_DIR))
# Inject version into all templates (cache buster for CSS/JS)
templates.env.globals["version"] = TEMPLATE_VERSION
@asynccontextmanager @asynccontextmanager
async def lifespan(app: FastAPI): async def lifespan(app: FastAPI):
+4 -4
View File
@@ -6,7 +6,7 @@
<meta name="apple-mobile-web-app-capable" content="yes"> <meta name="apple-mobile-web-app-capable" content="yes">
<meta name="apple-mobile-web-app-status-bar-style" content="black-translucent"> <meta name="apple-mobile-web-app-status-bar-style" content="black-translucent">
<title>{% block title %}Pi Multi-FX Pedal{% endblock %}</title> <title>{% block title %}Pi Multi-FX Pedal{% endblock %}</title>
<link rel="stylesheet" href="/static/style.css"> <link rel="stylesheet" href="/static/style.css?v={{ version }}">
<link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><text y='28' font-size='28'>🎸</text></svg>"> <link rel="icon" href="data:image/svg+xml,<svg xmlns='http://www.w3.org/2000/svg' viewBox='0 0 32 32'><text y='28' font-size='28'>🎸</text></svg>">
</head> </head>
<body> <body>
@@ -30,8 +30,8 @@
{% block content %}{% endblock %} {% block content %}{% endblock %}
</main> </main>
</div> </div>
<script src="/static/websocket.js"></script> <script src="/static/websocket.js?v={{ version }}"></script>
<script src="/static/app.js"></script> <script src="/static/app.js?v={{ version }}"></script>
{% block scripts %}{% endblock %} {% block scripts %}{% endblock %}
</body> </body>
</html> </html>