Florian Wilde
c0579c6f61
CI / pruefen (pull_request) Canceled after 0s
Ein Passkey ist der dritte Weg in denselben Trichter: finishLogin() prueft die Antwort und gibt die Kennung zurueck, der Endpunkt legt damit ueber createSession() dieselbe Sitzung an wie bei Passwort und OIDC. Die Sitzungsschicht bleibt unangetastet. Die Trennung zwischen Pruefung und Sitzung ist Absicht: in passkeys.ts steht nur WebAuthn, das Setzen von Cookie und Sitzungszeile gehoert zur HTTP-Schicht. Die Challenge liegt in einem signierten, fuenf Minuten gueltigen httpOnly- Cookie statt in einer Tabelle — das spart Schema und Aufraeumjob fuer alles, was liegen bleibt, wenn jemand den Dialog abbricht. Die RP ID kommt aus APP_URL, nicht aus dem Host-Header. Hinter einem Reverse Proxy hinge sie sonst am falschen Namen, und ein Passkey ist fest an diesen Namen gebunden. Ueber nacktes HTTP verschwindet die Verwaltung mit einem Hinweis statt einen kryptischen Browserfehler zu zeigen. Den letzten verbleibenden Anmeldeweg laesst sich nicht entfernen: wer kein Passwort und keine OIDC-Verknuepfung hat, behaelt seinen letzten Passkey. Die Bibliothek prueft den Signaturzaehler selbst und wirft dabei gewoehnliche Error. Die werden jetzt uebersetzt, damit eine erwartete Ablehnung nicht als unerwarteter Serverfehler im Log landet. Die eigene Zaehlerpruefung bleibt als zusaetzliche Sicherung fuer den Fall, den die Bibliothek durchlaesst. Geprueft mit virtuellem Authenticator gegen einen Produktionsbau: anlegen, abmelden, Anmeldung allein per Passkey, Sitzungscookie gesetzt, Challenge-Cookie verbraucht, Passwortweg unveraendert. Mit kuenstlich hochgesetztem Zaehler wird die Anmeldung abgelehnt und der Zaehler bleibt stehen. Dazu sieben Tests fuer Verwaltung, Rechte und die Aussperrsperre. Refs #6
69 lines
2.4 KiB
TypeScript
69 lines
2.4 KiB
TypeScript
import { redirect } from "next/navigation";
|
|
import type { Metadata } from "next";
|
|
import { getSessionUser } from "@/lib/auth";
|
|
import { getSettings, isRegistrationOpen } from "@/lib/settings";
|
|
import { env } from "@/lib/env";
|
|
import { AuthSwitch, LoginForm } from "@/components/AuthForm";
|
|
import { PasskeyLoginButton } from "@/components/settings/Passkeys";
|
|
import { loginAction } from "../actions";
|
|
|
|
export const metadata: Metadata = { title: "Anmelden" };
|
|
|
|
export default async function LoginPage({
|
|
searchParams,
|
|
}: {
|
|
searchParams: Promise<{ weiter?: string; fehler?: string }>;
|
|
}) {
|
|
if (await getSessionUser()) redirect("/");
|
|
|
|
const params = await searchParams;
|
|
const [settings, registrationOpen] = await Promise.all([getSettings(), isRegistrationOpen()]);
|
|
|
|
return (
|
|
<div className="fl-card p-6 sm:p-8">
|
|
<h1 className="text-2xl font-semibold tracking-tight">Willkommen zurück</h1>
|
|
<p className="mt-1 mb-6 text-sm text-[var(--fl-muted)]">
|
|
Melde dich an, um weiterzuschauen.
|
|
</p>
|
|
|
|
{params.fehler && (
|
|
<p
|
|
role="alert"
|
|
className="mb-4 rounded-xl border border-[color-mix(in_oklab,var(--fl-danger)_45%,transparent)] bg-[color-mix(in_oklab,var(--fl-danger)_12%,transparent)] px-3 py-2 text-sm text-[var(--fl-danger)]"
|
|
>
|
|
{params.fehler}
|
|
</p>
|
|
)}
|
|
|
|
<LoginForm action={loginAction} weiter={params.weiter} />
|
|
|
|
{(env.passkeys.isAvailable || env.oidc.isConfigured) && (
|
|
<>
|
|
<div className="my-5 flex items-center gap-3 text-xs text-[var(--fl-faint)]">
|
|
<span className="h-px flex-1 bg-[var(--fl-border)]" />
|
|
oder
|
|
<span className="h-px flex-1 bg-[var(--fl-border)]" />
|
|
</div>
|
|
|
|
<div className="space-y-2">
|
|
{env.passkeys.isAvailable && <PasskeyLoginButton label="Mit Passkey anmelden" />}
|
|
{env.oidc.isConfigured && (
|
|
<a href="/api/auth/oidc/start" className="fl-btn fl-btn-ghost w-full justify-center">
|
|
{env.oidc.buttonLabel}
|
|
</a>
|
|
)}
|
|
</div>
|
|
</>
|
|
)}
|
|
|
|
{registrationOpen && (
|
|
<div className="mt-6">
|
|
<AuthSwitch href="/registrieren">Noch kein Konto? Jetzt registrieren</AuthSwitch>
|
|
</div>
|
|
)}
|
|
|
|
<p className="mt-6 text-center text-xs text-[var(--fl-faint)]">{settings.instanceName}</p>
|
|
</div>
|
|
);
|
|
}
|