I thought it was complex and even expensive. It isn’t. Here’s how I added TOTP-style two-factor authentication (2FA) to a Blazor application.
👉 Repo GitHub: tossnet/Blazor-2FA
TOTP ?
TOTP stands for Time-based One-Time Password: a one-time password generated at regular intervals (usually every 30 seconds), based on a shared secret key.
This system is used by the majority of dual authentication applications, such as :
- ✅ Google Authenticator
- ✅ Microsoft Authenticator
- ✅ Authy, 1Password, Aegis Authenticator, etc.
Overall operation
- The server generates a secret key and a TOTP QR code in otpauth:// format.
- The user scans this QR code with their 2FA application
- On subsequent connections, the user enters a 6-digit code generated by his app
- The server verifies this code with the same key and the current time
Blazor project demo
I’ve open-sourced the project on Github. It is available here: 🔗 https://github.com/tossnet/Blazor-2FA. Also, I used Blazor Assembly simply in order to have a demo on GitHub. The Nugets Otp.NET and QRCoder packages
What it does:
- Generates a TOTP secret key
- Creates a scannable QR code in Google/Microsoft Authenticator
- Verification of the 6-digit code
- Validation message if code is correct
Sample code:
URI TOTP generated
For verification :
Why integrate 2FA into your application?
- ✅ Enhanced security
- ✅ Enhanced user account protection
- ✅ In line with modern cybersecurity practices
Conclusion
Adding 2FA TOTP to a Blazor or other application is very simple, secure and modern. Thanks to existing .NET libraries, everything can be done in C# with few external dependencies.