fix: ensure SSR always fetches fresh assets from database
CI Pipeline / backend-test (push) Successful in 5m31s
CI Pipeline / frontend-test (push) Successful in 23s
CI Pipeline / frontend-build (push) Failing after 27s
CI Pipeline / backend-lint (push) Successful in 8s
CI Pipeline / backend-test (pull_request) Successful in 5m24s
CI Pipeline / frontend-test (pull_request) Successful in 23s
CI Pipeline / frontend-build (pull_request) Failing after 27s
CI Pipeline / backend-lint (pull_request) Successful in 8s
CI Pipeline / quality-gate (push) Successful in 2s
CI Pipeline / quality-gate (pull_request) Successful in 2s
CI Pipeline / backend-test (push) Successful in 5m31s
CI Pipeline / frontend-test (push) Successful in 23s
CI Pipeline / frontend-build (push) Failing after 27s
CI Pipeline / backend-lint (push) Successful in 8s
CI Pipeline / backend-test (pull_request) Successful in 5m24s
CI Pipeline / frontend-test (pull_request) Successful in 23s
CI Pipeline / frontend-build (pull_request) Failing after 27s
CI Pipeline / backend-lint (pull_request) Successful in 8s
CI Pipeline / quality-gate (push) Successful in 2s
CI Pipeline / quality-gate (pull_request) Successful in 2s
Root cause: Dockerfile copied only browser/ to nginx; server/server.mjs was built but never deployed or executed. Prerender baked DEFAULT_CONFIG into static HTML with no API at build time, causing stale content on every initial paint. Changes: - Dockerfile: serve stage uses node:22-alpine, installs nginx via apk, copies both browser/ and server/ bundles from build stage - docker-entrypoint.sh: starts Angular SSR Node process on port 4200, waits for readiness, exports SSR_API_BASE_URL, then exec nginx - nginx.conf.template: adds upstream ssr_backend block (127.0.0.1:4200), proxies / to SSR backend, static assets served directly with 1y cache - app.server.routes.ts: all routes switched from RenderMode.Prerender to RenderMode.Server for zero stale content - server.ts: removed dead prerender code (PRERENDERED_ROUTES, isPrerenderedRoute, allowStaticRouteRender) - main.server.ts: injects SSR-aware apiBaseUrl via APP_CONFIG (reads SSR_API_BASE_URL env var) - server.spec.ts: updated 5 test suites + added 5 new suites (31 tests) covering server.ts cleanup, RenderMode.Server, entrypoint lifecycle, Dockerfile build, nginx upstream proxy, and API URL injection - vitest.config.ts: added server.spec.ts to include pattern Request flow: Browser -> nginx (port 80) -> SSR server (port 4200) -> Angular SSR -> HttpClient -> localhost:80/api/station-config -> nginx proxies to api:8000 -> fresh data rendered in HTML
This commit is contained in:
1 parent
2ece38e52d
commit
328d067d97
9 files changed
+243
-146
No files matched your search
@@ -10,34 +10,34 @@ describe('SSR server routes — app.server.routes.ts', () => {
|
||||
expect(serverRoutes).toHaveLength(8);
|
||||
});
|
||||
|
||||
it('should prerender the home route', () => {
|
||||
it('should use SSR mode for the home route', () => {
|
||||
const home = serverRoutes.find((r) => r.path === '');
|
||||
expect(home).toBeDefined();
|
||||
expect(home!.renderMode).toBe(RenderMode.Prerender);
|
||||
expect(home!.renderMode).toBe(RenderMode.Server);
|
||||
});
|
||||
|
||||
it('should prerender /about', () => {
|
||||
it('should use SSR mode for /about', () => {
|
||||
const about = serverRoutes.find((r) => r.path === 'about');
|
||||
expect(about).toBeDefined();
|
||||
expect(about!.renderMode).toBe(RenderMode.Prerender);
|
||||
expect(about!.renderMode).toBe(RenderMode.Server);
|
||||
});
|
||||
|
||||
it('should prerender /schedule', () => {
|
||||
it('should use SSR mode for /schedule', () => {
|
||||
const schedule = serverRoutes.find((r) => r.path === 'schedule');
|
||||
expect(schedule).toBeDefined();
|
||||
expect(schedule!.renderMode).toBe(RenderMode.Prerender);
|
||||
expect(schedule!.renderMode).toBe(RenderMode.Server);
|
||||
});
|
||||
|
||||
it('should prerender /events', () => {
|
||||
it('should use SSR mode for /events', () => {
|
||||
const events = serverRoutes.find((r) => r.path === 'events');
|
||||
expect(events).toBeDefined();
|
||||
expect(events!.renderMode).toBe(RenderMode.Prerender);
|
||||
expect(events!.renderMode).toBe(RenderMode.Server);
|
||||
});
|
||||
|
||||
it('should prerender /contact', () => {
|
||||
it('should use SSR mode for /contact', () => {
|
||||
const contact = serverRoutes.find((r) => r.path === 'contact');
|
||||
expect(contact).toBeDefined();
|
||||
expect(contact!.renderMode).toBe(RenderMode.Prerender);
|
||||
expect(contact!.renderMode).toBe(RenderMode.Server);
|
||||
});
|
||||
|
||||
it('should use SSR mode for /login', () => {
|
||||
@@ -58,13 +58,13 @@ describe('SSR server routes — app.server.routes.ts', () => {
|
||||
expect(wildcard!.renderMode).toBe(RenderMode.Server);
|
||||
});
|
||||
|
||||
it('should have exactly 5 prerendered routes', () => {
|
||||
it('should have no prerendered routes (eliminates stale DEFAULT_CONFIG)', () => {
|
||||
const prerendered = serverRoutes.filter((r) => r.renderMode === RenderMode.Prerender);
|
||||
expect(prerendered).toHaveLength(5);
|
||||
expect(prerendered).toHaveLength(0);
|
||||
});
|
||||
|
||||
it('should have exactly 3 SSR routes', () => {
|
||||
it('should have exactly 8 SSR routes (all routes)', () => {
|
||||
const ssr = serverRoutes.filter((r) => r.renderMode === RenderMode.Server);
|
||||
expect(ssr).toHaveLength(3);
|
||||
expect(ssr).toHaveLength(8);
|
||||
});
|
||||
});
|
||||
@@ -3,16 +3,18 @@ import { RenderMode, ServerRoute } from '@angular/ssr';
|
||||
/**
|
||||
* Server routes configuration for Angular SSR.
|
||||
*
|
||||
* The five public routes are prerendered at build time (SSG) for optimal SEO.
|
||||
* Authenticated routes (/login, /admin) use SSR for dynamic rendering.
|
||||
* All other routes fall back to SSR.
|
||||
* ALL routes use RenderMode.Server — every request hits the SSR server,
|
||||
* which fetches fresh station config from the API before rendering HTML.
|
||||
* This eliminates the stale-asset flash that occurred with prerendered HTML
|
||||
* (prerender runs at build time when the API is unavailable, baking in
|
||||
* DEFAULT_CONFIG values).
|
||||
*/
|
||||
export const serverRoutes: ServerRoute[] = [
|
||||
{ path: '', renderMode: RenderMode.Prerender },
|
||||
{ path: 'about', renderMode: RenderMode.Prerender },
|
||||
{ path: 'schedule', renderMode: RenderMode.Prerender },
|
||||
{ path: 'events', renderMode: RenderMode.Prerender },
|
||||
{ path: 'contact', renderMode: RenderMode.Prerender },
|
||||
{ path: '', renderMode: RenderMode.Server },
|
||||
{ path: 'about', renderMode: RenderMode.Server },
|
||||
{ path: 'schedule', renderMode: RenderMode.Server },
|
||||
{ path: 'events', renderMode: RenderMode.Server },
|
||||
{ path: 'contact', renderMode: RenderMode.Server },
|
||||
{ path: 'login', renderMode: RenderMode.Server },
|
||||
{ path: 'admin', renderMode: RenderMode.Server },
|
||||
{ path: '**', renderMode: RenderMode.Server },
|
||||
|
||||
@@ -4,13 +4,20 @@ import { provideServerRendering, withRoutes } from '@angular/ssr';
|
||||
|
||||
import { appConfig } from './app/app.config';
|
||||
import { App } from './app/app';
|
||||
import { APP_CONFIG, AppConfig } from './app/services/app-config.service';
|
||||
import { serverRoutes } from './app/app.server.routes';
|
||||
|
||||
// During SSR, the API base URL must be absolute (HttpClient runs in Node.js).
|
||||
// nginx proxies /api/ to the upstream, so point at nginx (port 80) locally.
|
||||
const ssrApiBaseUrl = process.env.SSR_API_BASE_URL || 'http://localhost:80';
|
||||
const ssrAppConfig: AppConfig = { apiBaseUrl: ssrApiBaseUrl };
|
||||
|
||||
const serverAppConfig = {
|
||||
...appConfig,
|
||||
providers: [
|
||||
...appConfig.providers,
|
||||
{ provide: APP_ID, useValue: 'server' },
|
||||
{ provide: APP_CONFIG, useValue: ssrAppConfig },
|
||||
provideServerRendering(withRoutes(serverRoutes)),
|
||||
],
|
||||
};
|
||||
|
||||
Reference in new issue
Block a user