fix: Déclencher WebAuthn directement lors du clic utilisateur

- Déplacer l'appel WebAuthn dans le gestionnaire de clic direct
- Ajouter logs de debugging pour WebAuthn availability
- Éviter les appels WebAuthn asynchrones qui ne sont pas considérés comme user gesture
- Améliorer les messages d'interface pour l'authentification
- Supprimer l'appel WebAuthn dupliqué dans prepareAndSendPairingTx
This commit is contained in:
NicolasCantu 2025-10-23 14:09:18 +02:00
parent 0c883dfcac
commit 066580f8d6
2 changed files with 30 additions and 25 deletions

View File

@ -108,11 +108,25 @@ export class SecureCredentialsService {
const isSecureContext = window.isSecureContext;
const hasWebAuthn = navigator.credentials && navigator.credentials.create;
secureLogger.info('WebAuthn availability check', {
component: 'SecureCredentialsService',
operation: 'webauthn_check',
isSecureContext,
hasWebAuthn,
userAgent: navigator.userAgent,
protocol: window.location.protocol
});
let credential = null;
if (isSecureContext && hasWebAuthn) {
// Stocker dans les credentials du navigateur (HTTPS requis)
try {
secureLogger.info('Attempting to create WebAuthn credential', {
component: 'SecureCredentialsService',
operation: 'webauthn_create_attempt'
});
credential = await navigator.credentials.create({
publicKey: {
challenge: new Uint8Array(32),

View File

@ -2533,6 +2533,20 @@ async function onCreateButtonClick() {
console.log(`🔍 Creator flow detected`);
updateCreatorStatus('Creating pairing process...');
// Initialize WebAuthn credentials immediately on user click
try {
const { secureCredentialsService } = await import('../services/secure-credentials.service');
updateCreatorStatus('🔐 Requesting browser authentication...');
// This should trigger the browser popup immediately
const credentials = await secureCredentialsService.generateSecureCredentials('4nk-pairing-password');
console.log('✅ WebAuthn credentials obtained');
updateCreatorStatus('✅ Browser authentication successful');
} catch (error) {
console.warn('⚠️ WebAuthn failed, continuing with fallback:', error);
updateCreatorStatus('⚠️ Using fallback authentication');
}
await prepareAndSendPairingTx();
updateCreatorStatus('Pairing process created! Generating 4 words...');
@ -2700,30 +2714,7 @@ export async function prepareAndSendPairingTx(): Promise<void> {
// Update UI with creator address
updateCreatorStatus(`Creator address: ${creatorAddress}`);
// Initialize secure credentials with PBKDF2 and browser credentials
try {
const { secureCredentialsService } = await import('../services/secure-credentials.service');
// Check if we're in a secure context (HTTPS)
if (window.isSecureContext) {
updateCreatorStatus('🔐 Initializing secure credentials with browser...');
} else {
updateCreatorStatus('🔐 Initializing secure credentials (HTTP mode - WebAuthn not available)...');
}
// This will trigger the browser popup for WebAuthn (only in HTTPS)
const credentials = await secureCredentialsService.generateSecureCredentials('4nk-pairing-password');
console.log('✅ Secure credentials initialized with PBKDF2 and WebAuthn');
if (window.isSecureContext) {
updateCreatorStatus('✅ Secure credentials ready (WebAuthn enabled)');
} else {
updateCreatorStatus('✅ Secure credentials ready (fallback mode - use HTTPS for WebAuthn)');
}
} catch (error) {
console.warn('⚠️ Secure credentials initialization failed:', error);
updateCreatorStatus('⚠️ Using fallback credentials');
}
// Secure credentials already initialized in the click handler
// Create pairing process with creator's address
const createPairingProcessReturn = await service.createPairingProcess(