OPNsense Forum

I have made a change to the WebUI login page to improve the experience when using local database and TOTP authentication.

Currently, users must concatenate their TOTP code and password into a single password field. This is inconvenient and interferes with browser password managers.

The proposed change provides a progressive login form that initially displays username and password fields modelled on the way that Keycloak works. When the selected WebGUI authentication server uses TOTP, submitting the first stage replaces the password field with a separate one-time code field.

The existing authentication back-end remains unchanged.

New login screens are attached.

Implementation

• Automatically detect a single selected Local TOTP or LDAP TOTP authentication server
• Read the configured token length and token ordering
• Support six-digit and eight-digit TOTP codes
• Enable browser autocomplete for username and password
• Disable autocomplete for the one-time code
• Preserve the original password input value for password-manager compatibility
• Combine password and TOTP using the browser's formdata event before submission
• Retain the existing server-side authentication, logging and session handling
• Fall back to the existing login form when automatic TOTP detection is not applicable

Compatibility

The change is confined to src/www/authgui.inc.

No changes are required to the authentication factory or the Local TOTP and LDAP TOTP authenticators.

Testing

Tested on OPNsense 26.7.9_1 running on a Sophos X210 lab firewall.

Confirmed:

• Local Database + TOTP authentication
• Automatic transition to the one-time code field
• Successful login with existing server-side authentication
• Existing login form appearance and styling

Further testing is recommended for LDAP + TOTP, eight-digit tokens, reverse token ordering, multiple authentication servers, browser password managers and authentication failure scenarios.

RADIUS-based MFA is not included in this change.

Deployment

Ensure that you are running OPNsense 26.7.9_1 - this patch has not been tested on previous releases.

Ensure you have at least one working user with TOTP enabled and working.

Check System → Settings → Administration → Authentication → Server and ensure that Local Database+TOTP is checked and Local Database is unchecked.

Login from the console and obtain a shell, then copy the patch to /tmp using scp or a USB stick, after which:

cd /usr/local/www
cp authgui.inc /root
patch -p3 --dry-run < opnsense-progressive-totp-upstream-candidate.patch
if successful:

patch -p3 < opnsense-progressive-totp-upstream-candidate.patch
exit
and then re-start services from the console.

You should now be able to login with the progressive OTP form.

No Warranty

This code works for me and has been tested on both my lab system and my production OPNsense server at home and is offered as an enhancement, however I am not responsible if you lock yourself out of your firewall or burn your house down.

Mike