If a user wants to enable two factor authentication then they go to Help - Settings menu and click on Two factor auth - Enable / Regenerate. Then they scan QR code using Google Authenticator mobile application (Or another authenticator app). This secret key is stored to DB, see extended User entity - ExtUser with two additional attributes: totpSecret and totpValidationCode.
After that they can log in to the system only if they enter additional Auth key to login form:
This demo uses Vaadin add-on org.vaadin.addons:qrcode:2.0.1 and com.warrenstrange:googleauth:1.1.1 library. See extended loginWindow and settings screen for implementation details.
Currently, we are not planning to include this option to the platform, but we are thinking about pluggable and generalized auth process that can be introduced in the near future.
@artamonov Maybe I’m misunderstanding something fundamentally here, but I thought everything in the web module is compiled to JS and run in the browser. If that is indeed the case, isn’t the code in this example problematic:
You are absolutely right about being completely mistaken The Cuba platform (or more precisely, the underlying Vaadin engine) runs much of its code server-side, also the web module in which this code is placed. Only snippets and general platform code (e.g. jQuery stuff) runs on the browser.
I am also looking at building a Multi-Factor Authentication for Cuba login. In my use case, I need to verify the login of the user first, before popping up a dialog to challenge the user for the Pin code. The pin code can be a Google Auth or SMS/email OTP. Is there a way to have Cuba validate the login credentials first, but not enable the session, before sending out the OTP and ask the user for it ? Currently the login screen called dologin and the session is created. But if I open the same screen in the same browser, my challenge dialog box is by passed.
I am currently building a 2FA for an application using this project as a base. However, I am trying to make a validation when enabling this feature by making the user input the verification code scanned by Google Authenticator and I am noticing 2 things:
The verification code persisted on the DB does not change dynamically as on the authenticator.
The generated code is never displayed on the authenticator.
This means, I can scan the QR code and get a key but that key is not the same as the verification code for the ExtUser.
Do you have any ideas on how to improve/fix that on my project?
The verification code in the database is not really used I believe, not sure. At least it works the other way around, the user provides the code which is checked by the GoogleAuthenticator service using the user secret (that one is important!).
If you are able to scan the QR code (that holds the user secret), your authenticator app should generate codes every 30 seconds automatically. The code shown should be entered and checked as described above.
Thanks for the quick answer!
Therefore, if the DB code is not really used, is there a proper way I can do this validation after enabling the 2FA, either by redirecting to the extended login screen after the QR scan or by manually entering the code generated by the GoogleAuthenticator service?