Step 1: Prerequisites
⏱ 2 minBefore implementing Step-up MFA, ensure you have the basics set up.
What You Need
Step-up MFA is designed to add an extra security layer on top of existing authentication. You need:
- Transcodes Project - Create one at app.transcodes.io
- User Authentication - Users must be logged in before triggering MFA
Why is login required? The openAuthMfaModal() function requires a User
ID to identify which user is performing MFA. This User ID is generated
during the login process, so the user must be authenticated before calling
MFA.
When to Use Step-up MFA
Step-up MFA is triggered after initial login, when users perform sensitive actions:
// User is already logged in
// Now they want to access admin panel
async function accessAdminPanel() {
// Step 1: Check if user is authenticated
const isAuth = await transcodes.token.isAuthenticated();
if (!isAuth) {
// Not logged in - redirect to login
await transcodes.openAuthLoginModal();
return;
}
// Step 2: Require MFA for admin access
const mfaResult = await transcodes.openAuthMfaModal();
if (mfaResult.success) {
// MFA verified - show admin panel
showAdminPanel();
}
}MFA vs Login
| Feature | Passkey Login | Step-up MFA |
|---|---|---|
| Purpose | Authenticate user | Verify identity for sensitive action |
| When | First time accessing app | Before critical operations |
| Function | openAuthLoginModal() | openAuthMfaModal() |
| User State | Not logged in | Already logged in |
Supported MFA Methods
Users can set up one or more MFA methods:
- TOTP - Google Authenticator, Authy, 1Password
- Email OTP - 6-digit code sent via email
- Hardware Keys - YubiKey, FIDO2 security keys
Users manage their MFA methods in the Auth Console Panel (openAuthModal()).
What’s Next
Prerequisites ready! Next: Step 2: Import CDN Script
Last updated on