Barcode-Based Authentication & 2FA
<\/script>\n';
},
get iframeSnippet() {
const domain = 'barcodefyi.com';
const type = 'guide';
const slug = 'barcode-authentication-2fa';
return '';
},
get activeSnippet() {
return this.method === 'script' ? this.scriptSnippet : this.iframeSnippet;
},
copySnippet() {
navigator.clipboard.writeText(this.activeSnippet).then(() => {
this.copied = true;
setTimeout(() => { this.copied = false; }, 2000);
});
}
}"
@keydown.escape.window="open = false"
@click.outside="open = false">
How barcodes enable two-factor authentication — TOTP QR setup codes, secure login flows, and the otpauth:// URI scheme.
Barcode-Based Authentication & 2FA
Barcodes play a crucial role in two-factor authentication (2FA) systems. The QR code you scan when setting up Google Authenticator or similar apps encodes a standardized URI that configures the time-based one-time password (TOTP) algorithm.
The otpauth URI Scheme
When you set up 2FA, the service displays a QR code encoding an otpauth URI:
otpauth://totp/Example:[email protected]?secret=JBSWY3DPEHPK3PXP&issuer=Example&algorithm=SHA1&digits=6&period=30
| Parameter | Description | Default |
|---|---|---|
| Type | totp (time-based) or hotp (counter-based) | totp |
| Label | Account name and issuer | Required |
| Secret | Base32-encoded shared secret | Required |
| Issuer | Service name | Recommended |
| Algorithm | Hash algorithm | SHA1 |
| Digits | OTP length | 6 |
| Period | Time step in seconds | 30 |
How TOTP Works
- Service generates a random shared secret
- Secret is encoded in a QR code (otpauth URI)
- User scans the QR with their authenticator app
- Both the service and the app now share the same secret
- Every 30 seconds, both sides compute: HMAC-SHA1(secret, floor(time/30))
- The result is truncated to a 6-digit code
- User enters the code; the service verifies it matches
QR Code Setup Flow
- User enables 2FA in their account settings
- Service generates a cryptographically random secret
- Service displays a QR code encoding the otpauth URI
- User scans the QR with their authenticator app
- App adds the account and begins generating codes
- User enters a current code to verify setup
- Service stores the secret (encrypted) and enables 2FA
Authenticator Apps
| App | Platform | Open Source |
|---|---|---|
| Google Authenticator | iOS, Android | No |
| Microsoft Authenticator | iOS, Android | No |
| Authy | iOS, Android, Desktop | No |
| FreeOTP | iOS, Android | Yes |
| Bitwarden | All platforms | Yes |
All apps use the same otpauth URI standard, so they are interchangeable.
Security Considerations
- Secret transmission: The QR code contains the shared secret in plain text. Display it only on trusted devices and over secure connections.
- Backup codes: Provide backup codes in case the user loses access to their authenticator
- Recovery: Plan a recovery process for users who cannot generate codes
- QR code exposure: The QR code should be shown once and not stored; displaying it again requires re-authentication
QR Code Login (Non-2FA)
Some services use QR codes for passwordless login:
- Login page displays a QR code with a session token
- User scans with the service's mobile app (already authenticated)
- App sends the session token + user credentials to the server
- Server authenticates the session
- Login page automatically logs in
Examples: WhatsApp Web, Slack, Discord.
Implementation Notes
- Use a cryptographically secure random number generator for secrets
- Encode secrets in Base32 (required by the otpauth standard)
- Generate QR codes at error correction level M (15%) or higher
- Include the issuer parameter for clear identification in authenticator apps
- Test with multiple authenticator apps before deploying