# Smartphone Passkey Test - Anleitung ## Test-Seite öffnen **Auf dem Smartphone öffnen:** ``` https://harheimertc.tsschulz.de/test-smartphone.html ``` ## Was die Test-Seite zeigt ### 1. Basis-Informationen - Aktuelle URL und Origin - Ob HTTPS/Secure Context aktiv ist - Ob WebAuthn unterstützt wird - Browser und Plattform-Info ### 2. OPTIONS Preflight Test - Testet, ob OPTIONS-Requests funktionieren - Zeigt CORS-Header - Sollte Status 204 zurückgeben ### 3. Registration Options Test - Testet den `/api/auth/register-passkey-options` Endpoint - Zeigt, ob Options korrekt zurückgegeben werden - Zeigt CORS-Header ### 4. WebAuthn API Test - Testet die komplette WebAuthn-Registrierung - Zeigt, ob `startRegistration` funktioniert - Zeigt, ob ein QR-Code erscheint (für Cross-Device) ### 5. Network Monitor - Zeigt alle Requests, die gesendet werden - Zeigt Status-Codes und URLs ## Was zu prüfen ist ### ✅ Erfolgreich, wenn: - **Basis-Info:** "Is Secure Context: JA ✓" und "WebAuthn Support: JA ✓" - **OPTIONS Test:** Status 204 und alle CORS-Header vorhanden - **Registration Options:** Status 200, `success: true`, `hasChallenge: JA ✓` - **WebAuthn Test:** Zeigt "SUCCESS ✓" oder QR-Code erscheint ### ❌ Probleme, wenn: - **OPTIONS Test:** Status 404 oder CORS-Header fehlen - **Registration Options:** Status 500 oder `success: false` - **WebAuthn Test:** Fehler wie "NotSupportedError" oder Timeout ## Häufige Probleme ### Problem 1: "WebAuthn Support: NEIN ✗" **Ursache:** Browser unterstützt WebAuthn nicht oder nicht in Secure Context **Lösung:** - Stelle sicher, dass HTTPS verwendet wird - Prüfe, ob der Browser WebAuthn unterstützt (Chrome, Safari, Edge sollten funktionieren) ### Problem 2: OPTIONS gibt 404 **Ursache:** Endpoint behandelt OPTIONS nicht korrekt **Lösung:** Sollte jetzt behoben sein mit `.options.js` Dateien ### Problem 3: CORS-Header fehlen **Ursache:** Server setzt CORS-Header nicht **Lösung:** Prüfe Server-Logs, ob CORS-Header gesetzt werden ### Problem 4: WebAuthn Test schlägt fehl **Ursache:** - Kein lokaler Authenticator verfügbar - Cross-Device-Verbindung funktioniert nicht - QR-Code wird nicht angezeigt **Lösung:** - Prüfe, ob ein QR-Code erscheint - Prüfe, ob das Smartphone die Website erreichen kann - Prüfe Server-Logs, ob Requests ankommen ## Nächste Schritte 1. **Öffne die Test-Seite auf dem Smartphone** 2. **Führe alle Tests aus** 3. **Screenshot oder kopiere die Ergebnisse** 4. **Prüfe Server-Logs während der Tests:** ```bash pm2 logs harheimertc --lines 50 ``` 5. **Teile die Ergebnisse**, dann können wir das Problem weiter eingrenzen ## Zusätzliche Debug-Info **Auf dem Smartphone:** - Öffne die Browser-Entwicklertools (falls verfügbar) - Prüfe den Network-Tab - Prüfe die Console auf Fehler **Auf dem Server:** - Prüfe PM2-Logs während der Tests - Prüfe Apache-Logs für Requests - Prüfe, ob Requests ankommen