feat: make API base URL runtime-configurable
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:
Executable
+16
@@ -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"
|
||||||
@@ -13,8 +13,9 @@ RUN npm ci
|
|||||||
|
|
||||||
COPY . .
|
COPY . .
|
||||||
|
|
||||||
# Bake the API base URL at build time (rsbuild inlines PUBLIC_* vars).
|
# Build-time default for the API base URL (rsbuild inlines PUBLIC_* vars). This
|
||||||
# Same-origin default ('/api/v1') works behind any reverse proxy.
|
# 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
|
ARG PUBLIC_API_BASE_URL=/api/v1
|
||||||
ENV PUBLIC_API_BASE_URL=$PUBLIC_API_BASE_URL
|
ENV PUBLIC_API_BASE_URL=$PUBLIC_API_BASE_URL
|
||||||
RUN npm run build
|
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 dockerfiles/nginx.conf /etc/nginx/conf.d/default.conf
|
||||||
COPY --from=build /app/dist /usr/share/nginx/html
|
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
|
EXPOSE 80
|
||||||
CMD ["nginx", "-g", "daemon off;"]
|
CMD ["nginx", "-g", "daemon off;"]
|
||||||
|
|||||||
@@ -14,6 +14,13 @@ server {
|
|||||||
try_files $uri =404;
|
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).
|
# SPA: every unknown path falls back to index.html (client-side router).
|
||||||
location / {
|
location / {
|
||||||
try_files $uri $uri/ /index.html;
|
try_files $uri $uri/ /index.html;
|
||||||
|
|||||||
@@ -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__ = {};
|
||||||
@@ -36,6 +36,16 @@ export default defineConfig({
|
|||||||
// "Install app". The service worker (audio offline cache) is registered
|
// "Install app". The service worker (audio offline cache) is registered
|
||||||
// from src/index.tsx, not here.
|
// from src/index.tsx, not here.
|
||||||
tags: [
|
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',
|
tag: 'link',
|
||||||
attrs: { rel: 'manifest', href: '/manifest.webmanifest' },
|
attrs: { rel: 'manifest', href: '/manifest.webmanifest' },
|
||||||
|
|||||||
+21
-1
@@ -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 =
|
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';
|
||||||
|
|||||||
Vendored
+8
@@ -5,3 +5,11 @@ interface ImportMetaEnv {
|
|||||||
interface ImportMeta {
|
interface ImportMeta {
|
||||||
readonly env: ImportMetaEnv;
|
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;
|
||||||
|
};
|
||||||
|
}
|
||||||
|
|||||||
Reference in New Issue
Block a user