Files
harheimertc/CROSS_DEVICE_PROBLEM_ZUSAMMENFASSUNG.md
Torsten Schulz (local) 04f38cda69
Some checks failed
Code Analysis (JS/Vue) / analyze (push) Failing after 54s
Enhance debug logging and validation in Passkey Registration API
Add additional debug statements to the register-passkey-options API to validate the options structure, including checks for challenge type and user ID format. Improve logging to capture detailed information about the options being returned, aiding in troubleshooting and ensuring compliance with Cross-Device requirements.
2026-01-08 15:57:19 +01:00

5.1 KiB

Cross-Device Passkey Problem - Zusammenfassung

Aktueller Status

Was funktioniert:

  • CORS ist korrekt konfiguriert (OPTIONS gibt 204 zurück)
  • POST-Requests funktionieren (Status 200)
  • Options werden korrekt generiert
  • QR-Code wird angezeigt (Desktop-Browser)
  • Website öffnet sich auf dem Smartphone nach QR-Code-Scan

Was nicht funktioniert:

  • Verbindung vom Smartphone zum Server wird nicht hergestellt
  • "Verbindung mit einem anderen Gerät wird hergestellt" bleibt hängen
  • Keine Requests vom Smartphone im Server-Log
  • Warnung: "startRegistration() was not called correctly"

Mögliche Ursachen

1. WebAuthn API auf dem Smartphone

Problem: Die WebAuthn-API auf dem Smartphone kann die Verbindung nicht herstellen.

Prüfung:

  • Öffne die Website direkt auf dem Smartphone: https://harheimertc.tsschulz.de/registrieren
  • Versuche, einen Passkey zu registrieren (ohne QR-Code)
  • Funktioniert das?

2. QR-Code-Inhalt

Problem: Der QR-Code enthält möglicherweise nicht die richtige URL oder Challenge.

Prüfung:

  • Scanne den QR-Code mit einem QR-Code-Scanner
  • Prüfe, welche URL/Informationen im QR-Code enthalten sind
  • Sollte die Origin https://harheimertc.tsschulz.de enthalten

3. Browser-Kompatibilität

Problem: Nicht alle Browser unterstützen Cross-Device Passkeys gleich gut.

Prüfung:

  • Welcher Browser wird auf dem Desktop verwendet? (Chrome, Firefox, Edge, Safari)
  • Welcher Browser wird auf dem Smartphone verwendet?
  • Chrome/Edge sollten am besten funktionieren

4. Netzwerk/Firewall

Problem: Das Smartphone kann die Server-Origin nicht erreichen (obwohl die Website funktioniert).

Prüfung:

  • Kann das Smartphone die Website direkt öffnen? (bereits bestätigt)
  • Kommen OPTIONS-Requests vom Smartphone an? (Test-Seite zeigt: )
  • Kommen POST-Requests vom Smartphone an? (Test-Seite zeigt: )

5. Options-Struktur

Problem: Die Warnung "startRegistration() was not called correctly" deutet auf ein Problem mit der Options-Struktur hin.

Prüfung:

  • Prüfe Browser-Konsole (Desktop) auf die Debug-Logs
  • Prüfe, ob die Options-Struktur korrekt ist
  • Die Options sollten direkt von @simplewebauthn/server kommen (keine manuelle Serialisierung)

Debugging-Schritte

Schritt 1: Server-Logs prüfen

pm2 logs harheimertc --lines 200 | grep -i "register-passkey\|mobile\|smartphone\|user-agent"

Was zu prüfen ist:

  • Kommt ein Request vom Smartphone an, wenn der QR-Code gescannt wird?
  • Welcher User-Agent? (Sollte "Mobile", "iPhone", "Android" enthalten)
  • Welche IP-Adresse? (Sollte die IP des Smartphones sein)

Schritt 2: Browser-Konsole prüfen (Desktop)

Öffne F12 → Console und prüfe:

  • Gibt es die Warnung "startRegistration() was not called correctly"?
  • Was zeigen die Debug-Logs [DEBUG] Full options structure check?
  • Wird der QR-Code angezeigt?

Schritt 3: Smartphone direkt testen

Öffne auf dem Smartphone:

https://harheimertc.tsschulz.de/registrieren

Versuche:

  • Registrierung mit Passkey (ohne QR-Code)
  • Funktioniert das? (Sollte einen lokalen Authenticator verwenden)

Schritt 4: QR-Code-Inhalt prüfen

Scanne den QR-Code mit einem QR-Code-Scanner:

  • Welche URL/Informationen sind enthalten?
  • Enthält er die richtige Origin?
  • Enthält er die Challenge?

Bekannte Probleme

Problem 1: "startRegistration() was not called correctly"

Ursache: Die Options-Struktur ist nicht korrekt.

Lösung:

  • Options werden jetzt direkt von @simplewebauthn/server zurückgegeben (keine manuelle Serialisierung)
  • Prüfe Browser-Konsole auf die Debug-Logs

Problem 2: Keine Requests vom Smartphone

Ursache: Cross-Device-Verbindung funktioniert nicht.

Mögliche Lösungen:

  1. Prüfe, ob beide Geräte im gleichen Netzwerk sind
  2. Prüfe, ob der Browser Cross-Device unterstützt (Chrome/Edge am besten)
  3. Prüfe, ob es Firewall-Blockierungen gibt
  4. Versuche einen anderen Browser

Problem 3: Timeout

Ursache: Die Verbindung wird nicht innerhalb von 5 Minuten hergestellt.

Lösung:

  • Prüfe, ob Requests ankommen
  • Prüfe, ob CORS korrekt ist ( bereits bestätigt)
  • Prüfe, ob die Origin übereinstimmt

Nächste Schritte

  1. Prüfe Server-Logs während des QR-Code-Scans:

    • Kommt ein Request an?
    • Welcher User-Agent?
    • Welche Fehlermeldungen?
  2. Prüfe Browser-Konsole (Desktop):

    • Gibt es noch die Warnung?
    • Was zeigen die Debug-Logs?
  3. Teste direkt auf dem Smartphone:

    • Öffne die Registrierungsseite
    • Versuche, einen Passkey zu registrieren (ohne QR-Code)
    • Funktioniert das?
  4. Teile die Ergebnisse:

    • Server-Logs
    • Browser-Konsole (Desktop)
    • Was passiert auf dem Smartphone?

Wichtige Erkenntnisse

  • CORS funktioniert (OPTIONS gibt 204 zurück)
  • POST-Requests funktionieren (Status 200)
  • Options werden korrekt generiert
  • QR-Code wird angezeigt
  • Website öffnet sich auf dem Smartphone
  • Verbindung vom Smartphone zum Server wird nicht hergestellt
  • Keine Requests vom Smartphone im Server-Log

Das Problem liegt wahrscheinlich in der Cross-Device-Verbindung selbst, nicht in CORS oder der Server-Konfiguration.