🔐 FIDO2 UI SDK - Modal Demo

Demonstrate how to use FIDO2 UI SDK to manage devices in a popup window

👤 Step1: Login

Click the button below to open the login modal:

📌 Step2: Device Management

Step1: Login first, then manage your FIDO2 devices

Please login first to access device management

📊 Event Log

💻 Code Examples

Simplest integration:

        Fido2UIManager.renderLogin({
  container: '#login-container',
  mode: 'modal',
  serverUrl: SERVER_URL
});
      

With theme customization:

        Fido2UIManager.renderLogin({
  container: '#login-container',
  mode: 'modal',
  serverUrl: SERVER_URL,
  language: 'ja',
  theme: {
    primaryColor: '#ce59d9',
    backgroundColor: '#faf5ff'
  },
  features: {
    enablePasswordLogin: true,
    autoShowPassword: true
  }
});
      

Device Manager:

        Fido2UIManager.renderDeviceManager({
  userId: currentUserId,
  container: '#device-container',
  mode: 'modal',
  serverUrl: SERVER_URL,
  language: 'ja'
});
      

✨ Features

Popup mode, stay on current page
Auto FIDO2/Passkey authentication
Password login fallback option
Add/delete FIDO2 devices support
Real-time device list display
Session status monitoring
Theme color and style customization
Multi-language support (English/Japanese/Chinese)
Event callback system