@synqauth/nextjs 0.0.0 → 0.2.0

package/README.md

@@ -54,6 +54,15 @@ export const config = { matcher: ['/((?!_next/|.*\\..*).*)'] }
 
 To add a way to sign in to someone's account (Google, a wallet, anything the brand offers), POST `{ method, returnTo }` as JSON to `/api/auth/link` from your own pages and send the browser to the `redirect` it answers, or call `useAuth().link('google')` from `@synqauth/react`: Synq asks them to sign in again, then adds it.
 
+To sign people in on your own page instead of the brand's (AERO-1411), turn on own-UI sign-in for the app in the dashboard and use `<SignInForm>` or `useSignIn()` from `@synqauth/react`. They post each step to `/api/auth/sign-in/flow`, which takes it to Synq as your app. Pass `clientAddress` to `defineSynqConfig` when your host doesn't set `x-real-ip`, so Synq can limit tries per address. Read a header your own proxy sets, never one the browser could send:
+
+```ts
+export const synqConfig = defineSynqConfig({
+  // Behind Cloudflare
+  clientAddress: (request) => request.headers.get('cf-connecting-ip') ?? undefined,
+})
+```
+
 In a server component, `await synq.me()` is the signed-in person or null, and `await synq.getAccessToken()` is a token for your API (`resource`). Link `synq.signInPath({ returnTo: '/dashboard' })` to sign in, and sign out with a form that POSTs to `synq.signOutPath`.
 
 ## When a sign-in doesn't finish

package/dist/{config-BNh2Aznt.d.ts → config-CpEbAGEs.d.ts}

@@ -173,6 +173,15 @@ interface SynqAuthOptions {
   plugins?: readonly SynqPlugin[];
   /** The `fetch` to call Synq with. */
   fetch?: typeof fetch;
+  /**
+   * Where the person signing in on the app's own screens is
+   * (`<basePath>/sign-in/flow`, AERO-1411), as this server saw them: Synq
+   * counts its per-address limits for the app with it (`Synq-End-User-IP`).
+   * `x-real-ip` by default, which Vercel sets; give one that reads your
+   * proxy's header otherwise. Return undefined, and per-address protection
+   * is off for the app.
+   */
+  clientAddress?: (request: Request) => string | undefined;
 }
 interface SynqConfig {
   readonly issuer: string;
@@ -194,6 +203,8 @@ interface SynqConfig {
   readonly refreshLeewaySeconds: number;
   readonly plugins: readonly SynqPlugin[];
   readonly fetch: typeof fetch | undefined;
+  /** Where a person signing in on the app's own screens is: `x-real-ip` by default. */
+  readonly clientAddress: (request: Request) => string | undefined;
   /** Over https: `Secure` cookies with the `__Host-` prefix. */
   readonly secure: boolean;
 }

package/dist/define.d.ts

@@ -1,4 +1,4 @@
-import { t as SynqAuthOptions } from "./config-BNh2Aznt.js";
+import { t as SynqAuthOptions } from "./config-CpEbAGEs.js";
 //#region src/define.d.ts
 /** Declares the app's Synq configuration: `SYNQ_*` environment variables fill in whatever it leaves out. */
 export declare function defineSynqConfig<const T extends SynqAuthOptions>(options: T): T;

package/dist/index.d.ts

@@ -1,4 +1,4 @@
-import { a as KeyValueSessionStoreOptions, c as keyValueSessionStore, d as SynqPluginContext, f as SynqPluginRoute, i as KeyValue, l as memorySessionStore, m as defineSynqPlugin, n as SynqConfig, o as SessionValues, p as SynqUser, r as resolveConfig, s as SynqSessionStore, t as SynqAuthOptions, u as SynqPlugin } from "./config-BNh2Aznt.js";
+import { a as KeyValueSessionStoreOptions, c as keyValueSessionStore, d as SynqPluginContext, f as SynqPluginRoute, i as KeyValue, l as memorySessionStore, m as defineSynqPlugin, n as SynqConfig, o as SessionValues, p as SynqUser, r as resolveConfig, s as SynqSessionStore, t as SynqAuthOptions, u as SynqPlugin } from "./config-CpEbAGEs.js";
 import { defineSynqConfig } from "./define.js";
 import { cookies } from "next/headers.js";
 //#region src/cookies.d.ts

package/dist/index.js

@@ -1,4 +1,4 @@
-import { c as memorySessionStore, d as normalizePath, f as resolveConfig, l as defineSynqPlugin, n as signInErrorMessage, o as createSynqCore, r as signInErrorOf, s as keyValueSessionStore, t as SIGN_IN_ERROR_PARAM } from "./sign-in-error-DSCgrk0b.js";
+import { c as memorySessionStore, d as normalizePath, f as resolveConfig, l as defineSynqPlugin, n as signInErrorMessage, o as createSynqCore, r as signInErrorOf, s as keyValueSessionStore, t as SIGN_IN_ERROR_PARAM } from "./sign-in-error-kd56GHt_.js";
 import { defineSynqConfig } from "./define.js";
 import { cookies } from "next/headers.js";
 import { cache } from "react";

package/dist/proxy.d.ts

@@ -1,4 +1,4 @@
-import { t as SynqAuthOptions } from "./config-BNh2Aznt.js";
+import { t as SynqAuthOptions } from "./config-CpEbAGEs.js";
 //#region src/proxy.d.ts
 /** What `synqProxy()` takes: which paths need a session. */
 export interface SynqProxyOptions {

package/dist/proxy.js

@@ -1,4 +1,4 @@
-import { a as withoutSignInError, f as resolveConfig, i as signInErrorPage, o as createSynqCore, r as signInErrorOf, t as SIGN_IN_ERROR_PARAM, u as requestJar } from "./sign-in-error-DSCgrk0b.js";
+import { a as withoutSignInError, f as resolveConfig, i as signInErrorPage, o as createSynqCore, r as signInErrorOf, t as SIGN_IN_ERROR_PARAM, u as requestJar } from "./sign-in-error-kd56GHt_.js";
 import { NextResponse } from "next/server.js";
 //#region src/proxy.ts
 /**

package/dist/{sign-in-error-DSCgrk0b.js → sign-in-error-kd56GHt_.js}

@@ -126,6 +126,7 @@ function resolveConfig(options = {}, env = processEnv()) {
 		refreshLeewaySeconds: options.refreshLeewaySeconds ?? 30,
 		plugins: options.plugins ?? [],
 		fetch: options.fetch,
+		clientAddress: options.clientAddress ?? ((request) => request.headers.get("x-real-ip")?.trim() || void 0),
 		secure: appUrl.protocol === "https:"
 	};
 }
@@ -598,6 +599,10 @@ const TRANSACTION_SECONDS = 3600;
 const TRANSACTION_PREFIX = "synq.tx.";
 const ACCOUNT_BODY_LIMIT = 65536;
 const LINK_BODY_LIMIT = 4096;
+/** A step of an own-UI sign-in: a passkey's assertion is the most it carries. */
+const FLOW_BODY_LIMIT = 16384;
+/** Where an own-UI sign-in's flow is kept, sealed: one a browser at a time. */
+const FLOW_KEY = `${TRANSACTION_PREFIX}flow`;
 /** `synq_siws` as @synqauth/solana's `encodeSiws` writes it: base64url, well under the body's limit. */
 const SIWS = /^[A-Za-z0-9_-]{1,3072}$/;
 /** Claims of the ID token that say nothing about the person. */
@@ -620,6 +625,8 @@ const PROTOCOL_CLAIMS = /* @__PURE__ */ new Set([
 * `synqAuth()` instead.
 */
 function createSynqCore(config) {
+	/** Whether the missing end-user address was logged already: once is enough. */
+	let warnedAboutAddress = false;
 	const keysFor = () => sealingKeys(config.sessionSecret, config.previousSessionSecrets);
 	/** Every request to Synq: never cached, and given up after REQUEST_TIMEOUT_MS. */
 	const upstream = (input, init = {}) => {
@@ -769,6 +776,7 @@ function createSynqCore(config) {
 		for (const { name } of started.slice(4)) jar.delete(name, { secure: config.secure });
 	}
 	async function signIn(request, jar) {
+		if (isPrefetch(request)) return new Response(null, { status: 204 });
 		const params = new URL(request.url).searchParams;
 		const returnTo = safeReturnTo(params.get("returnTo"), config.appUrl);
 		const prompt = params.get("prompt") ?? void 0;
@@ -789,7 +797,6 @@ function createSynqCore(config) {
 	}
 	async function callback(request, jar) {
 		const tx = await transactions(jar);
-		const previous = await load(jar);
 		const handle = newSession(config.sessionMaxAge, config.store);
 		try {
 			await client(handle.storage(config.primary, config.primary), config.primary, tx.storage).handleCallback(request.url);
@@ -797,14 +804,7 @@ function createSynqCore(config) {
 			const code = isSynqError(error) ? error.code : "server_error";
 			return redirect(withError(safeReturnTo(tx.found.returnTo ?? null, config.appUrl), code), 303);
 		}
-		if (previous) {
-			const [before, after] = await Promise.all([issuerSessionOf(previous), issuerSessionOf(handle)]);
-			if (!(before !== void 0 && after !== void 0 && before.sub === after.sub && (before.sid === void 0 || after.sid === void 0 || before.sid === after.sid))) try {
-				await client(previous.storage(config.primary, config.primary), config.primary).signOut();
-			} catch {}
-			await endSession(jar, previous, config.secure, config.store);
-		}
-		await commit(jar, handle);
+		await startSession(jar, handle);
 		return redirect(safeReturnTo(tx.found.returnTo ?? null, config.appUrl), 303);
 	}
 	async function signOut(request, jar) {
@@ -904,6 +904,183 @@ function createSynqCore(config) {
 			params: { synq_siws: input.siws }
 		})).href });
 	}
+	/**
+	* One step of a sign-in on the app's own screens (AERO-1411): the page
+	* posts what the person typed, `{ step, … }`, and this server takes it to
+	* Synq's Authorization Challenge Endpoint as the app, with where the
+	* person is (`clientAddress`). The flow (its PKCE verifier and Synq's auth
+	* session) stays sealed in a cookie; the page hears only what to show
+	* next, never a token, a code or the auth session. A sign-in that ends
+	* starts the session as the callback does.
+	*/
+	async function signInFlow(request, jar) {
+		if (request.headers.get("content-type")?.split(";", 1)[0]?.trim().toLowerCase() !== "application/json") return problem(415, "unsupported_media_type", "Send the step as JSON");
+		const length = Number(request.headers.get("content-length") ?? 0);
+		if (request.headers.has("transfer-encoding")) return problem(411, "length_required", "Send the body with a Content-Length");
+		if (!Number.isFinite(length) || length > FLOW_BODY_LIMIT) return problem(413, "payload_too_large", "The body is too large");
+		let input;
+		try {
+			const body = await request.text();
+			if (new TextEncoder().encode(body).length > FLOW_BODY_LIMIT) return problem(413, "payload_too_large", "The body is too large");
+			input = JSON.parse(body);
+			if (!input || typeof input !== "object") throw new TypeError("not an object");
+		} catch {
+			return problem(400, "invalid_request", "Send { step, … } as JSON");
+		}
+		const text = (name, max = 512) => typeof input[name] === "string" ? input[name].slice(0, max) : "";
+		const step = text("step", 32);
+		const returnTo = safeReturnTo(text("returnTo", 2048) || null, config.appUrl);
+		const tx = await transactions(jar, returnTo);
+		const saved = await tx.storage.get(FLOW_KEY);
+		if (step === "restart") {
+			await tx.storage.remove(FLOW_KEY);
+			return json({ status: "restarted" });
+		}
+		const endUserIp = config.clientAddress(request);
+		if (!endUserIp && !warnedAboutAddress) {
+			warnedAboutAddress = true;
+			console.warn("@synqauth/nextjs: own-UI sign-in can't tell where people sign in from (no x-real-ip): give synqAuth() a clientAddress, or per-address protection is off for this app");
+		}
+		const handle = newSession(config.sessionMaxAge, config.store);
+		const synq = client(handle.storage(config.primary, config.primary), config.primary);
+		const flow = saved ? synq.resumeSignIn(saved, { endUserIp }) : synq.startSignIn({
+			endUserIp,
+			additionalResources: config.accountApi && config.accountApi !== config.primary ? [config.accountApi] : []
+		});
+		const email = text("email", 254);
+		let result;
+		try {
+			switch (step) {
+				case "password":
+					result = text("screen") === "sign-up" ? await flow.password.signUp({
+						email,
+						password: text("password", 1024)
+					}) : await flow.password.signIn({
+						email,
+						password: text("password", 1024)
+					});
+					break;
+				case "email":
+					result = await flow.email.send(email);
+					break;
+				case "code":
+					result = flow.step === "verify-email" ? await flow.verifyEmail.verify(text("code", 32)) : await flow.email.verify(text("code", 32));
+					break;
+				case "resend":
+					result = flow.step === "verify-email" ? await flow.verifyEmail.resend() : await flow.email.resend();
+					break;
+				case "skip":
+					result = await flow.verifyEmail.skip();
+					break;
+				case "passkey-options":
+					result = await flow.passkey.options();
+					break;
+				case "passkey": {
+					const credential = input.credential;
+					if (!credential || typeof credential !== "object") return problem(400, "invalid_request", "credential is the passkey’s assertion");
+					result = await flow.passkey.signIn(credential, { related: input.related === true });
+					break;
+				}
+				default: return problem(400, "invalid_request", "step is password, email, code, resend, skip, passkey-options, passkey or restart");
+			}
+		} catch (error) {
+			if (isSynqError(error, "invalid_session")) {
+				await tx.storage.remove(FLOW_KEY);
+				return json({
+					status: "expired",
+					message: error.message
+				});
+			}
+			if (isSynqError(error, "too_many_requests")) return json({
+				status: "retry",
+				step: flow.step,
+				problem: "limited",
+				message: error.message,
+				...error.retryAfter === void 0 ? {} : { retryAfter: error.retryAfter }
+			});
+			throw error;
+		}
+		if (result.status === "signed-in") {
+			await tx.storage.remove(FLOW_KEY);
+			await startSession(jar, handle);
+			return json({
+				status: "signed-in",
+				returnTo: tx.found.returnTo ?? returnTo
+			});
+		}
+		if (flow.step === "done") await tx.storage.remove(FLOW_KEY);
+		else await tx.storage.set(FLOW_KEY, JSON.stringify(flow));
+		switch (result.status) {
+			case "code-sent": return json({
+				status: result.status,
+				step: flow.step,
+				email: result.email,
+				expiresAt: result.expiresAt.toISOString()
+			});
+			case "verify-email": return json({
+				status: result.status,
+				step: flow.step,
+				email: result.email,
+				canSkip: result.canSkip
+			});
+			case "passkey": return json({
+				status: result.status,
+				step: flow.step,
+				passkey: {
+					options: result.options,
+					related: result.related
+				},
+				...result.problem ? {
+					problem: result.problem,
+					message: result.message
+				} : {}
+			});
+			case "retry": return json({
+				status: result.status,
+				step: flow.step,
+				problem: result.problem,
+				message: result.message,
+				...result.retryAfter === void 0 ? {} : { retryAfter: result.retryAfter }
+			});
+			case "hosted": return json({
+				status: result.status,
+				hosted: {
+					reason: result.reason,
+					...result.method ? { method: result.method } : {},
+					...result.loginHint ? { loginHint: result.loginHint } : {}
+				}
+			});
+			case "refused": return json({
+				status: result.status,
+				reason: result.reason,
+				message: result.message
+			});
+		}
+	}
+	/**
+	* Starts the session `handle` holds the new sign-in's tokens of. A
+	* sign-in replaces whatever session the browser had, and its refresh
+	* token is revoked: an offline grant outlives the brand's session. But
+	* the same person signing in again within their session at the issuer,
+	* as adding a passkey or a way in asks, gets the grant the replaced
+	* session had, and Synq ends a grant with any refresh token of it
+	* revoked: that one is dropped instead. Same person: the ID tokens'
+	* `sub`. Same issuer session: their `sid`, which Synq includes for every
+	* app (AERO-1624) but one whose tenant turned it off; without it, the
+	* same `sub` is taken for the same session (a sign-in after it lapsed
+	* leaves the old grant to expire).
+	*/
+	async function startSession(jar, handle) {
+		const previous = await load(jar);
+		if (previous) {
+			const [before, after] = await Promise.all([issuerSessionOf(previous), issuerSessionOf(handle)]);
+			if (!(before !== void 0 && after !== void 0 && before.sub === after.sub && (before.sid === void 0 || after.sid === void 0 || before.sid === after.sid))) try {
+				await client(previous.storage(config.primary, config.primary), config.primary).signOut();
+			} catch {}
+			await endSession(jar, previous, config.secure, config.store);
+		}
+		await commit(jar, handle);
+	}
 	async function account(request, jar, path) {
 		if (!config.accountApi) return problem(404, "not_found", "The session holds no account API token: synqAuth()'s account is off");
 		if (!/^v1(\/[A-Za-z0-9._~-]+)+$/.test(path) || path.split("/").some((part) => part === "." || part === "..")) return problem(404, "not_found", "No such account API route");
@@ -972,6 +1149,7 @@ function createSynqCore(config) {
 		try {
 			if (rest === "sign-in" && request.method === "GET") response = await signIn(request, jar);
 			else if (rest === "sign-in" && request.method === "POST") response = await walletSignIn(request, jar);
+			else if (rest === "sign-in/flow" && request.method === "POST") response = await signInFlow(request, jar);
 			else if (rest === "callback" && request.method === "GET") response = await callback(request, jar);
 			else if (rest === "sign-out" && request.method === "POST") response = await signOut(request, jar);
 			else if (rest === "link" && request.method === "POST") response = await link(request, jar);
@@ -1015,6 +1193,17 @@ function createSynqCore(config) {
 	};
 }
 /**
+* Whether a request is a prefetch, not a person going there: Next.js's
+* router (`Next-Router-Prefetch`) and browsers' speculative loads (`Purpose`,
+* `Sec-Purpose`: prefetch or prerender).
+*/
+function isPrefetch(request) {
+	const h = request.headers;
+	if (h.get("next-router-prefetch") !== null) return true;
+	const purpose = `${h.get("purpose") ?? ""} ${h.get("sec-purpose") ?? ""}`.toLowerCase();
+	return /\b(prefetch|prerender)\b/.test(purpose);
+}
+/**
 * Where to send the browser back to on the app, as an absolute URL, never
 * another site: the app's root for anything else. It checks where the value
 * resolves to, not how it's spelled, since dot segments and encodings

package/package.json

@@ -1,6 +1,6 @@
 {
   "name": "@synqauth/nextjs",
-  "version": "0.0.0",
+  "version": "0.2.0",
   "description": "Synq for Next.js: a backend-for-frontend session, so the browser never holds a Synq token.",
   "license": "MIT",
   "repository": {
@@ -39,7 +39,7 @@
     "access": "public"
   },
   "dependencies": {
-    "@synqauth/js": "0.0.0"
+    "@synqauth/js": "0.2.0"
   },
   "peerDependencies": {
     "next": ">=16.0.0",