Erst die ehrliche Hälfte: dass es heute **andauernd** abgemeldet hat, geht auf mein Konto. Ich habe die Datenbank dreimal geleert, um mit frischen Metadaten zu bauen; jedes Mal verfallen alle Token. Kein Schalter der Welt hätte das verhindert. Die andere Hälfte ist ein echter Fehler, und er macht aus einem Aussetzer eine Abmeldung: **Eine einzelne 401 warf die Anmeldung weg** — und rief dabei `/auth/logout`, der Server zog das Token also *aktiv zurück*. War die Ablehnung nur ein Aussetzer, war eine intakte Anmeldung damit absichtlich zerstört, und zwar unwiderruflich. Jetzt wird einmal nachgefragt: gilt das Token wirklich nicht mehr, ist die Sitzung vorbei; antwortet der Server, war es diese eine Anfrage. Mehrere gleichzeitige Anfragen laufen in dieselbe Prüfung — sonst stellte eine Startseite mit acht Abfragen achtmal dieselbe Frage. Antwortet der Server **gar nicht**, ist das kein Beleg gegen das Token: jemanden abzumelden, weil das WLAN hakt, ist der falsche Schluss. **Abmelden scheitert nie mehr.** Vorher verlangte der Weg eine gültige Anmeldung — und genau dann, wenn man ihn am dringendsten braucht, gibt es keine. Nach dem Leeren des Datenbestands zeigte das Cookie im Browser auf ein Token, das es nicht mehr gab; es ging bei jedem Bild erneut hinaus, und der Server lehnte es jedes Mal ab. Achtzig Ablehnungen in einer Stunde, und nichts davon liess sich von aussen beenden. Jetzt wird das Cookie immer gelöscht; widerrufen wird, was sich widerrufen lässt. --- **Und der Schalter, um den es ging.** „Angemeldet bleiben" steht jetzt im Anmeldefeld, mit Haken als Vorgabe — am eigenen Rechner will sich niemand täglich neu anmelden. Umgesetzt über die beiden Speicher, die der Browser ohnehin richtig aufräumt: mit Haken `localStorage` und ein Cookie für ein Jahr, ohne Haken `sessionStorage` und ein Sitzungscookie, das mit dem Fenster verschwindet. Ein eigenes Verfallsdatum zu verwalten wäre die schlechtere Variante — eine Uhr, die man stellen kann, gegen zwei Mechanismen, die es schon gibt. Das Token selbst läuft weiterhin **nie** ab; es wird widerrufen, nicht vergessen. Was hier entschieden wird, ist allein, wie lange der Browser sich erinnert. 372 Tests grün, vier davon neu. Am Container nachgemessen: mit Haken `max-age=31536000`, ohne Haken kein `max-age`, und ein Abmelden mit ungültigem Cookie antwortet 204 statt 401. Co-Authored-By: Claude Opus 5 <noreply@anthropic.com>
49 lines
1.6 KiB
TypeScript
49 lines
1.6 KiB
TypeScript
import { anmelden } from '../api';
|
|
import { knopf, feld, fehlerzeile } from '../util';
|
|
|
|
export function anmeldung(fertig: () => void): HTMLElement {
|
|
const karte = document.createElement('div');
|
|
karte.className = 'login-card';
|
|
|
|
const titel = document.createElement('h1');
|
|
titel.textContent = 'Flaro';
|
|
|
|
const name = feld('Benutzername');
|
|
name.autocomplete = 'username';
|
|
const passwort = feld('Passwort', 'password');
|
|
passwort.autocomplete = 'current-password';
|
|
|
|
// **Vorgabe ist „bleiben".** Am eigenen Rechner will sich niemand täglich
|
|
// neu anmelden; wer an einem fremden sitzt, schaltet es ab. Ohne Haken
|
|
// verfällt die Anmeldung mit dem Browserfenster.
|
|
const bleiben = document.createElement('label');
|
|
bleiben.className = 'bleiben';
|
|
const haken = document.createElement('input');
|
|
haken.type = 'checkbox';
|
|
haken.checked = true;
|
|
bleiben.append(haken, document.createTextNode(' Angemeldet bleiben'));
|
|
|
|
const los = knopf('Anmelden', 'btn btn-primary');
|
|
|
|
karte.append(titel, name, passwort, bleiben, los);
|
|
|
|
async function absenden(): Promise<void> {
|
|
karte.querySelector('.fehler')?.remove();
|
|
los.disabled = true;
|
|
try {
|
|
await anmelden(name.value.trim(), passwort.value, haken.checked);
|
|
fertig();
|
|
} catch (fehler) {
|
|
karte.appendChild(fehlerzeile((fehler as Error).message));
|
|
los.disabled = false;
|
|
passwort.select();
|
|
}
|
|
}
|
|
|
|
los.onclick = () => void absenden();
|
|
name.onkeydown = e => { if (e.key === 'Enter') passwort.focus(); };
|
|
passwort.onkeydown = e => { if (e.key === 'Enter') void absenden(); };
|
|
setTimeout(() => name.focus(), 50);
|
|
return karte;
|
|
}
|