Enhance Cross-Device registration debugging and API options
Some checks failed
Code Analysis (JS/Vue) / analyze (push) Failing after 47s

Update the registrieren.vue component to improve debug logging for Cross-Device registration, including checks for local authenticators and tunnel server connections. Add warnings for potential issues when Cross-Device is not used. Modify the register-passkey-options API to ensure compatibility with Cross-Device requirements by allowing both platform and cross-platform authenticators. This update aims to provide clearer insights and troubleshooting guidance during the Passkey registration process.
This commit is contained in:
Torsten Schulz (local)
2026-01-09 08:10:13 +01:00
parent ea4c86f6b4
commit 1ef5f7cc07
2 changed files with 48 additions and 7 deletions

View File

@@ -737,16 +737,32 @@ const handleRegisterWithPasskey = async () => {
// WICHTIG: Prüfe, ob Cross-Device überhaupt unterstützt wird
console.log('[DEBUG] Checking Cross-Device support...')
console.log('[DEBUG] Platform Authenticator Available:', await mod.platformAuthenticatorIsAvailable())
console.log('[DEBUG] Browser Supports WebAuthn:', mod.browserSupportsWebAuthn())
const platformAuthAvailable = await mod.platformAuthenticatorIsAvailable()
const browserSupportsWebAuthn = mod.browserSupportsWebAuthn()
console.log('[DEBUG] Platform Authenticator Available:', platformAuthAvailable)
console.log('[DEBUG] Browser Supports WebAuthn:', browserSupportsWebAuthn)
// Prüfe, ob ein lokaler Authenticator verfügbar ist
// Wenn ja, wird möglicherweise kein Cross-Device verwendet
if (platformAuthAvailable) {
console.warn('[DEBUG] ⚠️ WARNUNG: Platform Authenticator ist verfügbar!')
console.warn('[DEBUG] Der Browser könnte einen lokalen Authenticator verwenden (Windows Hello, TouchID)')
console.warn('[DEBUG] statt Cross-Device. Prüfe, ob ein QR-Code erscheint oder ein lokaler Dialog.')
}
// Versuche startRegistration aufzurufen
// Bei Cross-Device wird automatisch ein QR-Code generiert
// Das Smartphone muss dann die Website öffnen können
// Der Browser sollte eine Verbindung zu Tunnel-Servern aufbauen (cable.ua5v.com, cable.auth.com)
console.log('[DEBUG] Calling startRegistration...')
console.log('[DEBUG] ⚠️ WICHTIG: Wenn Cross-Device verwendet wird, sollte ein QR-Code erscheinen')
console.log('[DEBUG] ⚠️ Das Smartphone muss dann die Website öffnen können:', window.location.origin)
console.log('[DEBUG] ⚠️ Prüfe, ob das Smartphone die Website erreichen kann!')
console.log('[DEBUG] ⚠️ WICHTIG: Prüfe Browser Network-Tab während startRegistration läuft!')
console.log('[DEBUG] Erwartete Tunnel-Server-Requests:')
console.log('[DEBUG] - cable.ua5v.com (Google Chrome/Edge)')
console.log('[DEBUG] - cable.auth.com (Apple Safari)')
console.log('[DEBUG] - Andere Tunnel-Server (abhängig vom Browser)')
console.log('[DEBUG] Wenn KEINE Tunnel-Requests sichtbar sind:')
console.log('[DEBUG] → Cross-Device wird NICHT verwendet')
console.log('[DEBUG] → Möglicherweise wird ein lokaler Authenticator verwendet')
console.log('[DEBUG] → Oder der Browser unterstützt Cross-Device nicht')
credential = await mod.startRegistration({ optionsJSON: pre.options })
@@ -761,6 +777,26 @@ const handleRegisterWithPasskey = async () => {
durationSeconds: Math.round(webauthnDuration / 1000),
note: 'Wenn Cross-Device verwendet wurde, sollte die Credential-Response vom Smartphone kommen'
})
// Prüfe, ob Cross-Device verwendet wurde
if (credential?.transports && credential.transports.length > 0) {
console.log('[DEBUG] Credential transports:', credential.transports)
const isCrossDevice = credential.transports.includes('hybrid') || credential.transports.includes('cable')
console.log('[DEBUG] Cross-Device verwendet:', isCrossDevice ? '✅ JA' : '❌ NEIN')
if (!isCrossDevice) {
console.warn('[DEBUG] ⚠️ WARNUNG: Cross-Device wurde NICHT verwendet!')
console.warn('[DEBUG] Mögliche Ursachen:')
console.warn('[DEBUG] 1. Lokaler Authenticator wurde verwendet (z.B. Windows Hello, TouchID)')
console.warn('[DEBUG] 2. Tunnel-Server-Verbindung fehlgeschlagen')
console.warn('[DEBUG] 3. Browser unterstützt Cross-Device nicht')
console.warn('[DEBUG] 4. Keine Tunnel-Requests im Network-Tab sichtbar')
}
} else {
console.warn('[DEBUG] ⚠️ WARNUNG: Keine transports-Information verfügbar!')
console.warn('[DEBUG] Kann nicht bestimmen, ob Cross-Device verwendet wurde.')
console.warn('[DEBUG] Prüfe Browser Network-Tab: Wurden Requests zu Tunnel-Servern gemacht?')
console.warn('[DEBUG] Erwartete Tunnel-Server: cable.ua5v.com, cable.auth.com')
}
} catch (webauthnError) {
const webauthnDuration = Date.now() - webauthnStart
console.error(`[DEBUG] WebAuthn startRegistration failed (${webauthnDuration}ms / ${Math.round(webauthnDuration / 1000)}s):`, {

View File

@@ -101,7 +101,12 @@ export default defineEventHandler(async (event) => {
attestationType: 'none',
authenticatorSelection: {
residentKey: 'preferred',
userVerification: 'preferred'
userVerification: 'preferred',
// WICHTIG: Für Cross-Device sollte requireResidentKey false sein
// und authenticatorAttachment nicht auf 'platform' beschränkt sein
// (sonst wird nur lokaler Authenticator verwendet)
requireResidentKey: false
// authenticatorAttachment nicht setzen = erlaubt sowohl platform als auch cross-platform
},
// Timeout erhöhen für Cross-Device (Standard: 60s, hier: 5 Minuten)
timeout: 300000