fix: made wifi environment variables accessible to frontend

- Also reverted change in run_wrapper.sh where backend variables where
overwritten. This is simply not an issue as variables are baked-in at
build time.
This commit is contained in:
etiennecollin
2025-08-13 23:09:43 -04:00
parent 7c17a790d4
commit ec2be36bb2
7 changed files with 54 additions and 6 deletions

View File

@@ -81,6 +81,10 @@ WORKDIR /app
RUN addgroup -g 1001 -S appgroup && \ RUN addgroup -g 1001 -S appgroup && \
adduser -S appuser -u 1001 -G appgroup adduser -S appuser -u 1001 -G appgroup
# Copy entrypoint script
COPY ./scripts/entrypoint.sh ./
RUN chmod +x entrypoint.sh
# Copy run wrapper script # Copy run wrapper script
COPY ./scripts/run_wrapper.sh ./ COPY ./scripts/run_wrapper.sh ./
RUN chmod +x run_wrapper.sh RUN chmod +x run_wrapper.sh
@@ -108,4 +112,5 @@ ENV BACKEND_BIND_PORT="8080"
HEALTHCHECK --interval=30s --timeout=10s --start-period=60s --retries=3 \ HEALTHCHECK --interval=30s --timeout=10s --start-period=60s --retries=3 \
CMD /usr/local/bin/healthcheck.sh CMD /usr/local/bin/healthcheck.sh
ENTRYPOINT ["./entrypoint.sh"]
CMD ["./run_wrapper.sh"] CMD ["./run_wrapper.sh"]

View File

@@ -18,6 +18,10 @@ export default function RootLayout({
}>) { }>) {
return ( return (
<html lang="en" suppressHydrationWarning> <html lang="en" suppressHydrationWarning>
<head>
{/* Load runtime config */}
<script src="/runtime-config.js"></script>
</head>
<body className={`antialiased`}>{children}</body> <body className={`antialiased`}>{children}</body>
</html> </html>
); );

View File

@@ -0,0 +1,7 @@
declare global {
interface Window {
__RUNTIME_CONFIG__?: { [key: string]: string | undefined };
}
}
export {};

View File

@@ -0,0 +1,4 @@
export const getRuntimeConfig = (): Record<string, string | undefined> => {
if (typeof window === "undefined") return {};
return window.__RUNTIME_CONFIG__ ?? {};
};

View File

@@ -1,3 +1,5 @@
import { getRuntimeConfig } from "@/utils/runtimeConfig";
type WifiType = "WPA" | "WEP" | "nopass"; type WifiType = "WPA" | "WEP" | "nopass";
export interface WifiConfig { export interface WifiConfig {
@@ -8,10 +10,12 @@ export interface WifiConfig {
} }
export function generateWifiConfig(): WifiConfig { export function generateWifiConfig(): WifiConfig {
const ssid = process.env.NEXT_WIFI_SSID; const {
const password = process.env.NEXT_WIFI_PASSWORD; WIFI_SSID: ssid,
const type = process.env.NEXT_WIFI_TYPE; WIFI_PASSWORD: password,
const hidden = process.env.NEXT_WIFI_HIDDEN; WIFI_TYPE: type,
WIFI_HIDDEN: hidden,
} = getRuntimeConfig();
if (ssid == null) { if (ssid == null) {
throw "No SSID provided, use the environment variable WIFI_SSID to set one"; throw "No SSID provided, use the environment variable WIFI_SSID to set one";

25
scripts/entrypoint.sh Normal file
View File

@@ -0,0 +1,25 @@
#!/usr/bin/env sh
set -e
# Set variables accessible by the frontend
mkdir -p /app/frontend/public
# Build runtime-config.js containing only env vars that are defined and non-empty.
node - <<'NODE'
const fs = require('fs');
const outPath = '/app/frontend/public/runtime-config.js';
const keys = ['WIFI_SSID','WIFI_PASSWORD','WIFI_TYPE','WIFI_HIDDEN'];
const cfg = {};
for (const k of keys) {
const v = process.env[k];
if (v !== undefined) {
cfg[k] = v;
}
}
fs.writeFileSync(outPath, 'window.__RUNTIME_CONFIG__ = ' + JSON.stringify(cfg) + ';', 'utf8');
console.log('WROTE', outPath, 'keys=', Object.keys(cfg));
NODE
# exec the original command
exec "$@"

View File

@@ -17,8 +17,7 @@ sleep 3
# Start frontend in foreground # Start frontend in foreground
echo "Starting frontend..." echo "Starting frontend..."
NEXT_TELEMETRY_DISABLED="1" NODE_ENV="production" \ NEXT_TELEMETRY_DISABLED="1" NODE_ENV="production" \
HOSTNAME=${FRONTEND_BIND_HOST} PORT="${FRONTEND_BIND_PORT}" \ HOSTNAME="${FRONTEND_BIND_HOST}" PORT="${FRONTEND_BIND_PORT}" \
UNIFI_CONTROLLER_URL="" UNIFI_API_KEY="" UNIFI_SITE_ID="" \
node ./frontend/server.js & node ./frontend/server.js &
FRONTEND_PID=$! FRONTEND_PID=$!