[keycloak-dev] Improve back-button and refreshes in authenticators?

[Marek Posolda]

When working on login sessions, I wonder if we want to improve browser 
back-button and browser refreshes.

In shortcut, I can see 3 basic options:

1) Keep same like now and rely on header "Cache-Control: no-store, 
must-revalidate, max-age=0" . This works fine and users never saw 
outdated form and never submit outdated form 2 times. However the 
usability sucks a bit IMO. When you press back-button after POST 
request, you can see the ugly browser page "Web page has expired" . And 
if you press F5 on this, you will see the unfriendly Keycloak error page 
"Error was occured. Please login again through your application" because 
of invalid code.

2) Use the pattern with POST followed by the redirect to GET. Since we 
will have loginSession with the ID in the cookie, the GET request can be 
sent to the URL without any special query parameter. Something like 
"http://localhost:8180/auth/realms/master/login-actions/authenticate" . 
This will allow us that in every stage of authentication, user can press 
back-button and will be always redirected to the first step of the flow. 
When he refreshes the page, it will re-send just the GET request and 
always brings him to the current execution.

This looks most user-friendly. But there is the issue with performance 
though. As we will need to followup every POST request with one 
additional GET request.

3) Don't do anything special regarding back-button or refresh. But in 
case that page is refreshed AND the post with invalid (already used) 
code will be re-submitted, we won't display the ugly page "Error was 
occured.", but we will just redirect to current step of the flow.

Example:
a) User was redirected from the application to OIDC 
AuthorizationEndpoint request. Login page is shown
b) User confirmed invalid username and password with POST request. Login 
form with error page "Invalid password" is shown
c) User confirmed valid username and password with POST request. TOTP 
page is shown.
d) User press back-button. Now he will see again the page with 
username/password form.
e) User press F5. The POST request will be re-sent, but it will use 
previous "code", which is outdated now. So in this case, we will 
redirect to the current execution and TOTP form will be shown. No 
re-submission of username/password form will happen.

In case 3, the username/password form will be shown again, but user 
won't be able to resubmit it.

In shortcut: With 2 and 3, users will never see the browser page "Web 
page is expired" or Keycloak "Error occured. Go back to the 
application". With 2, there is additional GET request needed. With 3, 
the back-button may show the authentication forms, which user already 
successfully confirmed, but he won't be able to re-submit them. Is it 
bad regarding usability? To me, it looks better than showing "Web page 
is expired".

So my preference is 3,2,1. WDYT? Any other options?

Marek