Access the live demo of the website here.
Demo user: user@email.com
Demo Epin: 88118811
We often use 2FA as an added option for our login. But how does it work?
Both the server (authentication provider) and the client (user’s device) share a secret key. This secret key is typically encoded as a Base32 string.
The TOTP algorithm relies on time intervals, typically set to 30 seconds.
The time is combined with the shared secret key to create an HMAC (Hash-based Message Authentication Code).
The user enters the OTP generated by their TOTP client (e.g.google authenticator). The server then performs the same calculation using the shared secret and the current time step to generate the expected OTP. If the OTP entered by the user matches the server-generated OTP, authentication is successful.
Presume that the user email and Epin has been initialized and registered.
using the demo user and Epin enter them into the fields as seen.
QR code should be generated as seen. With an authenticator (e.g. google authenticator), capture the QR code.
Enter the OTP code as seen from your authenticator. When successful, the server will return user with a "Login successful!"
Device that is used to generate the OTP must be syncronized
Ensure that time is accurate on your device's authenticator. TOTP algorithm as mention is extremely time sensitive.
Server Side
Must be keep syncronized to the NTP public server. In our project's case, we are using google's NTP server.