secure-a-frontend-applisted

# Secure a frontend app Auth, session, access control, and secrets for a web app. App structure: `structure-a-frontend-app`; feature code: `write-frontend-code`. ## 1. Auth & session - **OIDC via NextAuth.** Configure the provider (with PKCE/nonce checks) in the auth route; store the session **server-side** (a session-store adapter, e.g. Redis) rather than a fat JWT cookie. - **Refresh in the session callback.** On each `session` resolve, check expiry and rotate the access token before handing it to the client: ```ts async session({ session, user }) { const acct = await store.getAccount(user.id); if (Date.parse(acct.expires_at) < Date.now()) { const next = await refreshAccessToken(acct); // rotate session.accessToken = next.access_token; } return session; } ``` - **One client-side entry injects the token** into the HTTP client: a `useAuth` hook reads the session and calls `BaseHttp.saveToken(session.accessToken)` (the HTTP client is in `write-frontend-code` §2). - **401 → one queued refresh + replay** at the HTTP layer (the refresh QUEUE in `write-frontend-code` §2): concurrent 401s wait on a single refresh, then retry. ▸ *Other stacks:* any OIDC lib (Auth.js / oidc-client) + a server session store; rotate in the session hook, inject once into the HTTP client, queue-refresh on 401. ## 2. SSR cookie propagation + hydration - **Pass auth cookies from SSR into the app** via the app-init hook, then read them in providers: ```ts