Native Authentifizierung

Einrichtung und Konfiguration

Lesen Sie vor jedem Schritt Bevor Sie beginnen und Terminal-Grundlagen. Bei diesen Anweisungen wird davon ausgegangen, dass Sie das vollständige Supastack-Monorepo in VS Code geöffnet haben. Sein Stamm package.json markiert den Repository-Stamm. In pnpm-Befehlen ist ein Arbeitsbereichspaket eine App oder ein Ordner mit gemeinsam genutztem Code. Im Produkt ist ein Arbeitsbereich der Datencontainer und die Sicherheitsgrenze eines Teams. corepack pnpm --filter ... wählt ein Paket aus dem Monorepo aus, während Befehle von seinem Stammverzeichnis aus ausgeführt werden. Wenn Sie nur einen synchronisierten Mobil- oder Desktop-Ordner geöffnet haben, enthält dieser weder das Web-Backend, Docker-Setup noch Root-Skripte: Führen Sie das Backend von diesem Monorepo oder einem erreichbaren gehosteten Server aus und verwenden Sie die eigenen Skripte des Plattformordners. Eine Umgebungsvariable ist eine benannte Einstellung, die in einer lokalen .env-Datei oder Ihrem Hosting-Dashboard gespeichert ist; Starten Sie die entsprechende App neu, nachdem Sie sie geändert haben, und halten Sie Servergeheimnisse von den Werten NEXT_PUBLIC_ und EXPO_PUBLIC_ fern.

1. Öffnen Sie apps/mobile/src/auth/client.ts und apps/mobile/src/auth/mobile-auth-configuration.ts in VS Code, um den vorhandenen Anmeldeablauf zu finden.

2. Fügen Sie EXPO_PUBLIC_API_URL und EXPO_PUBLIC_APP_SCHEME in apps/mobile/.env.local ein und stellen Sie sicher, dass der Webserver über eigene Einstellungen in apps/web/.env.local. verfügt

3. Starten Sie Web im Root mit corepack pnpm --filter @supastack/web dev und starten Sie dann in einem anderen Terminal Expo mit corepack pnpm --filter @supastack/mobile start. Erwartet: Eine Testanmeldung öffnet den Browser und kehrt zur mobilen App zurück. Verwenden Sie auf einem physischen Telefon die erreichbare Wi-Fi/LAN-Adresse des Computers für das API; phone-localhost bezeichnet das Telefon selbst.

Die Mobile-App verwendet die Better-Auth-Expo-Integration und nativen sicheren Speicher. API-Ursprung und App-Schema müssen mit der nativen Konfiguration und dem zulässigen Rückgabeablauf des Authentifizierungsservers übereinstimmen.

EXPO_PUBLIC_API_URL=https://your-api.example
EXPO_PUBLIC_APP_SCHEME=supastack

Befehle zum Kopieren

Befolgen Sie die Kommentare, um zu sehen, in welchem Ordner ein Befehl ausgeführt wird. Wenn zwei Terminals gekennzeichnet sind, öffnen Sie zwei Terminalfenster und lassen Sie den ersten Befehl laufen, während Sie den zweiten verwenden.

# Terminal 1 — Web API (from the monorepo root):
corepack pnpm --filter @supastack/web dev

# Terminal 2 — Expo app (from the monorepo root):
corepack pnpm --filter @supastack/mobile start

Implementierungsablauf

Verwende den vorhandenen nativen Authentifizierungs-Client, statt Cookie-Annahmen aus dem Web auf Mobilgeräte zu übertragen. Öffne die Provider-Anmeldung über den konfigurierten Browser-Ablauf, verarbeite den Callback und löse anschließend die authentifizierte Sitzung auf, bevor du geschützte Aktionen anbietest.

Halten Sie eine abgebrochene Anmeldung klar von einer erfolgreichen Anmeldung getrennt. Mitglieder können unter Einstellungen → Sicherheit eine biometrische App-Sperre (Face ID, Touch ID oder Fingerabdruck in apps/mobile/src/security/app-lock.ts) aktivieren, um die Rückkehr in den Vordergrund abzusichern. Löschen Sie beim Abmelden die lokale Darstellung des vorherigen Benutzers sowie den Workspace-gebundenen Offline-Lese-Cache (apps/mobile/src/offline/) und prüfen Sie, dass die Serversitzung keine geschützten Aktionen mehr ausführen kann.

Überprüfung und Fehlerbehebung

Öffnet die Anmeldung einen Browser, kehrt aber nicht zur App zurück, prüfen Sie, ob EXPO_PUBLIC_APP_SCHEME mit dem Schema in apps/mobile/app.config.ts übereinstimmt. Kann die App den Server nicht erreichen, ersetzen Sie localhost durch die LAN-Adresse des Computers, verbinden Sie beide Geräte mit demselben Netzwerk und starten Sie Expo nach einer Änderung an apps/mobile/.env.local neu. Expo Go ist eine UI-Vorschau; für die Abnahme nativer Käufe ist ein EAS-Development-Build erforderlich.

Prüfe auf dem vorgesehenen Build Callbacks beim Kaltstart, die Rückkehr zu einer laufenden App, abgebrochene Anmeldungen und abgelaufene Sitzungen. Wenn der Browser zurückkehrt, die App aber abgemeldet bleibt, prüfe Schema-Zuordnung und API-Erreichbarkeit, bevor du die Provider-Konfiguration änderst.