Files
apf_portal/libs/feature/auth/src/lib/auth.service.ts
T
Julien Gautier dd375859a4
CI / commits (pull_request) Successful in 1m28s
CI / scan (pull_request) Successful in 1m40s
CI / check (pull_request) Successful in 1m56s
CI / a11y (pull_request) Successful in 1m40s
CI / perf (pull_request) Successful in 4m36s
fix(portal-shell): send withCredentials on /me so the session cookie crosses SPA→BFF in dev
manual smoke surfaced the bug: the callback wrote the session and
set the portal_session cookie correctly, but the spa's next /me call
came back 401 with no cookie header at all.

root cause: angular's HttpClient via withFetch() inherits fetch's
default `credentials: 'same-origin'`. localhost:4200 → localhost:3000
is cross-origin (different ports), so the session cookie is dropped
on the way out — the bff never sees it. samesite=lax was a red
herring: localhost:4200 and localhost:3000 share the registrable
domain, so the cookie is still same-site; what was missing was
opting the fetch into credentials.

fix is per-call: only /me needs cookies today. login/logout are
full-page navigations through window.location, which the browser
hydrates with cookies regardless. a global HttpInterceptor will land
when other authenticated bff endpoints exist — premature for one
consumer.

bff side was already wired: enableCors({ credentials: true }) in
main.ts. nothing to change there.

a spec pins withCredentials=true on the /me request so a future
refactor can't silently drop the flag and reintroduce the bug.
2026-05-12 22:30:30 +02:00

126 lines
4.6 KiB
TypeScript

import { HttpClient, HttpErrorResponse } from '@angular/common/http';
import { Injectable, computed, inject, signal } from '@angular/core';
import { firstValueFrom } from 'rxjs';
import { AUTH_BFF_BASE_URL, AUTH_NAVIGATOR } from './auth.config';
import type { AuthState, CurrentUser } from './auth.types';
/**
* SPA-side authentication state, sourced from the BFF's
* `GET /api/auth/me` (ADR-0009 / ADR-0010). Acts as the single point
* of truth for "is the user signed in?" — every consumer (header
* widget, future route guards, downstream API gates) reads from the
* `state` / `currentUser` signals.
*
* Auto-bootstraps on first injection: the constructor fires an
* unawaited `refresh()`, so consuming components see `{kind:
* 'loading'}` briefly, then either `authenticated` or `anonymous`.
*
* `login()` and `logout()` perform full-page navigations to the BFF
* routes — the SPA never holds tokens (per ADR-0009), so a browser
* redirect through the Entra round-trip is the canonical path.
*/
@Injectable({ providedIn: 'root' })
export class AuthService {
private readonly http = inject(HttpClient);
private readonly bffBaseUrl = inject(AUTH_BFF_BASE_URL);
private readonly navigate = inject(AUTH_NAVIGATOR);
private readonly _state = signal<AuthState>({ kind: 'loading' });
readonly state = this._state.asReadonly();
/**
* Convenience: the user payload when authenticated, `null`
* otherwise. Lets templates write `@if (currentUser(); as user)`
* without unwrapping the discriminated state by hand.
*/
readonly currentUser = computed<CurrentUser | null>(() => {
const s = this._state();
return s.kind === 'authenticated' ? s.user : null;
});
/** True only while the very first /me round-trip is in flight. */
readonly isLoading = computed(() => this._state().kind === 'loading');
constructor() {
// Fire-and-forget so the constructor stays synchronous —
// Angular DI runs `providedIn: 'root'` services on first inject,
// which happens during app boot; awaiting here would push the
// first render behind the network round-trip.
void this.refresh();
}
/**
* Re-fetch `/auth/me`. Called automatically on first injection;
* consumers can call it again to refresh after a flow that may
* have changed the session (login redirect return, MFA step-up).
* Resolves once the new state is committed.
*/
async refresh(): Promise<void> {
try {
// `withCredentials: true` is mandatory: the SPA at
// http://localhost:4200 calls the BFF at http://localhost:3000 —
// different origins, so `fetch`'s default `credentials:
// 'same-origin'` would drop the `__Host-portal_session` cookie
// and /me would always answer 401. Production (single origin
// behind the same edge) doesn't need it but it's harmless there.
// CORS on the BFF side already allows credentials
// (`apps/portal-bff/src/main.ts` → `enableCors({ credentials:
// true })`).
const user = await firstValueFrom(
this.http.get<CurrentUser>(this.meUrl, { withCredentials: true }),
);
this._state.set({ kind: 'authenticated', user });
} catch (err) {
this._state.set(toErrorState(err));
}
}
/**
* Initiate sign-in by navigating to the BFF's `/auth/login`. The
* BFF builds the Entra authorize URL and 302s the browser; the
* round-trip lands on `/auth/callback` which writes the session
* and redirects back to the SPA.
*
* The navigation goes through the injected {@link AUTH_NAVIGATOR}
* function — `window.location.assign` in production, a `vi.fn()`
* in specs.
*/
login(): void {
this.navigate(this.loginUrl);
}
/**
* Initiate sign-out by navigating to the BFF's `/auth/logout`,
* which destroys the session, clears the cookie, and 302s through
* Entra's RP-initiated logout — single sign-out per ADR-0009.
*/
logout(): void {
this.navigate(this.logoutUrl);
}
get meUrl(): string {
return `${this.bffBaseUrl}/auth/me`;
}
get loginUrl(): string {
return `${this.bffBaseUrl}/auth/login`;
}
get logoutUrl(): string {
return `${this.bffBaseUrl}/auth/logout`;
}
}
function toErrorState(err: unknown): AuthState {
// The BFF returns 401 with `{error: 'unauthenticated'}` when no
// session is on the request. Anything else (network failure,
// 5xx, malformed response) lands in the explicit `error` state so
// the UI can distinguish "please sign in" from "can't reach the
// server right now".
if (err instanceof HttpErrorResponse && err.status === 401) {
return { kind: 'anonymous' };
}
return { kind: 'error' };
}