olly/mcma-webui
1
0
Fork 0
Code Issues Pull Requests Actions Packages Projects Releases Wiki Activity

feat: make API base URL runtime-configurable

Browse Source 
The PROD image baked PUBLIC_API_BASE_URL at build time (rsbuild inlines
PUBLIC_* vars), so a prebuilt image could only ever target a same-origin
'/api/v1' and needed a reverse proxy in front. Move the operator default to
runtime so one image can point at any backend origin without rebuilding.

- public/config.js: committed stub setting window.__APP_CONFIG__ = {}, used
  as the dev/build-time default and overwritten in prod at container start.
- rsbuild.config.ts: inject a classic (non-deferred) <script src="/config.js">
  into <head> so it runs before the deferred app bundle.
- src/config/env.ts: DEFAULT_API_BASE_URL now resolves
  window.__APP_CONFIG__.apiBaseUrl > import.meta.env.PUBLIC_API_BASE_URL >
  '/api/v1'. The user-chosen instance still wins over all of these.
- dockerfiles/30-runtime-config.sh: nginx /docker-entrypoint.d hook that
  regenerates /config.js from $PUBLIC_API_BASE_URL on every start.
- Dockerfile.prod: install the hook (build-time ARG is now just a fallback).
- nginx.conf: serve /config.js with Cache-Control: no-store.

Co-Authored-By: Claude Opus 4.8 <noreply@anthropic.com>
This commit is contained in:
Senko-san
2026-06-08 12:40:59 +03:00
parent 451dbb94a8
commit bcfb36d53e
7 changed files with 78 additions and 3 deletions
Download Patch File Download Diff File Expand all files Collapse all files
dockerfiles/30-runtime-config.sh
Executable
+16
View File
@@ -0,0 +1,16 @@
#!/bin/sh
# Write the SPA's runtime operator config at container start.
#
# The nginx base image runs every /docker-entrypoint.d/*.sh before launching
# nginx, so this overwrites the build-time public/config.js stub with the value
# of $PUBLIC_API_BASE_URL. That lets one prebuilt image target any backend
# origin without rebuilding. Resolution + precedence live in src/config/env.ts.
set -eu
: "${PUBLIC_API_BASE_URL:=/api/v1}"
ROOT="${NGINX_HTML_ROOT:-/usr/share/nginx/html}"
printf 'window.__APP_CONFIG__={"apiBaseUrl":"%s"};\n' "$PUBLIC_API_BASE_URL" \
>"$ROOT/config.js"
echo "runtime-config: wrote apiBaseUrl=$PUBLIC_API_BASE_URL to $ROOT/config.js"
dockerfiles/Dockerfile.prod
+8 -2
View File
@@ -13,8 +13,9 @@ RUN npm ci
COPY . .
# Bake the API base URL at build time (rsbuild inlines PUBLIC_* vars).
# Same-origin default ('/api/v1') works behind any reverse proxy.
# Build-time default for the API base URL (rsbuild inlines PUBLIC_* vars). This
# is only the *fallback* now — the real value is injected at container start by
# 30-runtime-config.sh, so the image can target any backend without a rebuild.
ARG PUBLIC_API_BASE_URL=/api/v1
ENV PUBLIC_API_BASE_URL=$PUBLIC_API_BASE_URL
RUN npm run build
@@ -25,5 +26,10 @@ FROM nginx:1.27-alpine AS runtime
COPY dockerfiles/nginx.conf /etc/nginx/conf.d/default.conf
COPY --from=build /app/dist /usr/share/nginx/html
# Runtime config injection: the nginx image runs /docker-entrypoint.d/*.sh
# before starting, regenerating /config.js from $PUBLIC_API_BASE_URL.
COPY dockerfiles/30-runtime-config.sh /docker-entrypoint.d/30-runtime-config.sh
RUN chmod +x /docker-entrypoint.d/30-runtime-config.sh
EXPOSE 80
CMD ["nginx", "-g", "daemon off;"]
dockerfiles/nginx.conf
+7
View File
@@ -14,6 +14,13 @@ server {
try_files $uri =404;
}
# Runtime operator config — regenerated per container start, so it must
# never be cached or a redeployed backend URL would be ignored.
location = /config.js {
add_header Cache-Control "no-store";
try_files $uri =404;
}
# SPA: every unknown path falls back to index.html (client-side router).
location / {
try_files $uri $uri/ /index.html;
public/config.js
+8
View File
@@ -0,0 +1,8 @@
// Runtime operator configuration, read by the app before the bundle loads
// (see src/config/env.ts). In the PROD image this file is OVERWRITTEN at
// container start from $PUBLIC_API_BASE_URL (dockerfiles/30-runtime-config.sh),
// so one prebuilt image can target any backend origin without a rebuild.
//
// This committed stub is the local-dev / build-time default: it leaves the
// config empty so base-URL resolution falls back to the build-time env var.
window.__APP_CONFIG__ = {};
rsbuild.config.ts
+10
View File
@@ -36,6 +36,16 @@ export default defineConfig({
// "Install app". The service worker (audio offline cache) is registered
// from src/index.tsx, not here.
tags: [
// Runtime operator config. A classic (non-deferred) head script, so it
// runs before the deferred app bundle and window.__APP_CONFIG__ is set by
// the time src/config/env.ts reads it. Served from public/ in dev and
// overwritten from $PUBLIC_API_BASE_URL at container start in prod.
{
tag: 'script',
attrs: { src: '/config.js' },
head: true,
append: false,
},
{
tag: 'link',
attrs: { rel: 'manifest', href: '/manifest.webmanifest' },
src/config/env.ts
+21 -1
View File
@@ -1,2 +1,22 @@
/**
* Default backend base URL — the operator-set fallback used when no specific
* instance is active. Resolution order:
*
* 1. window.__APP_CONFIG__.apiBaseUrl — runtime, injected by the container
* at start from $PUBLIC_API_BASE_URL (see public/config.js). Lets one
* prebuilt image point at any backend origin without rebuilding.
* 2. import.meta.env.PUBLIC_API_BASE_URL — build-time default (rsbuild inlines
* PUBLIC_* vars). Used in local dev and as a baked fallback.
* 3. '/api/v1' — same-origin relative path (works behind a reverse proxy).
*
* The user's chosen instance still wins over all of these — see
* runtime-config.ts / instances.ts.
*/
function runtimeApiBaseUrl(): string | undefined {
if (typeof window === 'undefined') return undefined;
const value = window.__APP_CONFIG__?.apiBaseUrl;
return value ? value : undefined;
}
export const DEFAULT_API_BASE_URL =
import.meta.env.PUBLIC_API_BASE_URL ?? '/api/v1';
runtimeApiBaseUrl() ?? import.meta.env.PUBLIC_API_BASE_URL ?? '/api/v1';
src/env.d.ts
Vendored
+8
View File
@@ -5,3 +5,11 @@ interface ImportMetaEnv {
interface ImportMeta {
readonly env: ImportMetaEnv;
}
// Runtime operator config injected by /config.js before the app bundle loads
// (written from $PUBLIC_API_BASE_URL at container start). See src/config/env.ts.
interface Window {
__APP_CONFIG__?: {
apiBaseUrl?: string;
};
}