From 0e4f0fc611c5c51605189d112c424b57a5ad3504 Mon Sep 17 00:00:00 2001 From: Julien Gautier Date: Tue, 12 May 2026 22:35:10 +0200 Subject: [PATCH] =?UTF-8?q?fix(portal-shell):=20send=20withCredentials=20o?= =?UTF-8?q?n=20/me=20so=20the=20session=20cookie=20crosses=20SPA=E2=86=92B?= =?UTF-8?q?FF=20in=20dev=20(#114)?= MIME-Version: 1.0 Content-Type: text/plain; charset=UTF-8 Content-Transfer-Encoding: 8bit ## Summary Manual smoke after PR #113 surfaced a dev-only bug: after `/auth/callback` the BFF correctly sets the `portal_session` cookie and redirects to the SPA, but the SPA's next call to `/api/auth/me` comes back **401 with no `cookie:` header at all**. The user lands "back at the portal" but the header still shows "Sign in". **Root cause.** Angular's `HttpClient` via `withFetch()` inherits `fetch`'s default `credentials: 'same-origin'`. In dev, `localhost:4200` (SPA) → `localhost:3000` (BFF) is cross-origin (different ports), so the browser drops the session cookie on the way out. SameSite=Lax is a red herring: both URLs share the registrable domain, so the cookie is still same-site — what was missing was opting the fetch into credentials. **Fix.** Per-call `withCredentials: true` on the /me request. 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 be the right abstraction once other authenticated BFF endpoints exist — premature for one consumer. **BFF side was already correct.** `enableCors({ credentials: true })` in `main.ts`. Nothing to change. A new spec pins `withCredentials === true` on the /me request so a future refactor can't silently drop the flag and reintroduce the bug. ## Test plan - [x] `pnpm nx test feature-auth` → **9/9 pass** (was 8 before; +1 spec pinning the credentials flag). - [x] `pnpm nx test portal-shell` → **32/32 pass**. - [x] `pnpm nx lint feature-auth portal-shell` → clean. - [x] `pnpm nx build portal-shell` → clean. - [ ] Manual smoke against the running BFF: anonymous landing → click "Sign in" → Entra → callback → SPA lands with avatar + display name in the header (the very last step that failed before this fix). --------- Co-authored-by: Julien Gautier Reviewed-on: https://git.unespace.com/julien/apf_portal/pulls/114 --- libs/feature/auth/src/lib/auth.service.spec.ts | 12 ++++++++++++ libs/feature/auth/src/lib/auth.service.ts | 13 ++++++++++++- 2 files changed, 24 insertions(+), 1 deletion(-) diff --git a/libs/feature/auth/src/lib/auth.service.spec.ts b/libs/feature/auth/src/lib/auth.service.spec.ts index 7aac605..83ebee3 100644 --- a/libs/feature/auth/src/lib/auth.service.spec.ts +++ b/libs/feature/auth/src/lib/auth.service.spec.ts @@ -62,6 +62,18 @@ describe('AuthService', () => { expect(service.isLoading()).toBe(false); }); + it('issues /me with withCredentials so the session cookie crosses the SPA→BFF origin gap', () => { + const { http } = setup(); + const req = http.expectOne(ME_URL); + // Without this, `fetch`'s default `credentials: 'same-origin'` + // would suppress the session cookie on the cross-origin + // (localhost:4200 → localhost:3000) request and /me would + // always answer 401 in dev. Verified manually against the BFF + // log on 2026-05-12. + expect(req.request.withCredentials).toBe(true); + req.flush({ error: 'unauthenticated' }, { status: 401, statusText: 'Unauthorized' }); + }); + it('transitions to anonymous on 401', async () => { const { service, http } = setup(); http diff --git a/libs/feature/auth/src/lib/auth.service.ts b/libs/feature/auth/src/lib/auth.service.ts index cc8043a..212fe0b 100644 --- a/libs/feature/auth/src/lib/auth.service.ts +++ b/libs/feature/auth/src/lib/auth.service.ts @@ -58,7 +58,18 @@ export class AuthService { */ async refresh(): Promise { try { - const user = await firstValueFrom(this.http.get(this.meUrl)); + // `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(this.meUrl, { withCredentials: true }), + ); this._state.set({ kind: 'authenticated', user }); } catch (err) { this._state.set(toErrorState(err));