Files
harheimertc/CROSS_DEVICE_PROBLEM_ZUSAMMENFASSUNG.md
Torsten Schulz (local) ea4c86f6b4
Some checks failed
Code Analysis (JS/Vue) / analyze (push) Failing after 53s
Enhance Cross-Device support and documentation for Passkey Registration
Update the CROSS_DEVICE_PROBLEM_ZUSAMMENFASSUNG.md to clarify the role of tunnel servers in the Cross-Device authentication process and outline troubleshooting steps. Additionally, enhance the registrieren.vue component with detailed information about the FIDO Cross-Device flow, including QR-Code format, connection requirements, and potential issues. Improve the register-passkey-options API documentation to reflect the use of tunnel servers, ensuring better understanding and support for Cross-Device functionality.
2026-01-09 08:04:50 +01:00

172 lines
6.1 KiB
Markdown

# 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)
- QR-Code enthält FIDO-URI (Format: `FIDO:/...`)
**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
- Smartphone öffnet keine Website nach QR-Code-Scan
## Wichtige Erkenntnis: Tunnel-Server
**FIDO Cross-Device verwendet Tunnel-Server:**
- `cable.ua5v.com` (Google)
- `cable.auth.com` (Apple)
**Wie funktioniert es:**
1. Desktop-Browser generiert QR-Code mit öffentlichem Schlüssel (FIDO-URI)
2. Smartphone scannt QR-Code
3. **Smartphone verbindet sich über Tunnel-Server mit Desktop-Browser** (nicht direkt mit dem Server!)
4. Desktop-Browser leitet Credential-Response an den Server weiter
**Voraussetzungen:**
- ✅ Beide Geräte müssen **Internetverbindung** haben
- ✅ Tunnel-Server müssen erreichbar sein (Firewall/Netzwerk: cable.ua5v.com, cable.auth.com)
- ⚠️ Bluetooth kann für physische Nähe-Bestätigung verwendet werden (abhängig vom Browser/Gerät)
- ⚠️ Einige Browser/Implementierungen erfordern Bluetooth für Cross-Device
## 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. Tunnel-Server / Netzwerk/Firewall
**Problem:** Das Smartphone kann die Tunnel-Server nicht erreichen oder Bluetooth ist nicht aktiviert.
**Prüfung:**
- Ist Bluetooth auf beiden Geräten aktiviert? ⚠️ **WICHTIG für Cross-Device!**
- Können Tunnel-Server erreicht werden? (cable.ua5v.com, cable.auth.com)
- Sind die Geräte in physischer Nähe? (Bluetooth-Reichweite)
- Gibt es Firewall-Blockierungen für Tunnel-Server?
- Kann das Smartphone die Website direkt öffnen? ✅ (bereits bestätigt)
### 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
```bash
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.**