custom logout issue : when user presses browser back button, previous screen displays

custom logout issue : when user presses browser back button, previous screen displays

  

Hii ,
i'm designing a web app where i have custom logout ( login info stored in own separate entity)
When user clicks logout button, session is destroyed ( manually through assigning null to session variables) and is redirected to login screen.
But on pressing BROWSER BACK BUTTON ( backward  or forward navigation in browser) , user gets back the previous screen with all the preparation data being displayed.
I have used if else to prevent other elements ( like buttons or any such ) from displaying and is working fine for them .
But any table present on screen ( populated with preparation data) gets displayed irrespective of  if-else.

Please suggest me how to deal with it ? How should i use javascript or extended props to overcome this issue ?

PS: i tried to use "onload" extended prop on table and put this expression in value but its not working. Table gets displayed instead.

SyntaxEditor Code Snippet

" if( !Session.IsLoggedIn) 
  <a href='https://xyz.outsystemscloud.com/LoginAppp/LoginScreen.aspx'>Session expired !!  Click to login</a> 
"

 

Screenshot attached.

Thanks

Solution

Hi Anand,

You can block the browser back button, or clear the browser cache when user does logout.

Block back button:

$().ready(function() {
    if(document.referrer != 'http://localhost:8181/'){ 
        history.pushState(null, null, 'login');
        window.addEventListener('popstate', function () {
            history.pushState(null, null, 'login');
        });
    }
});

Or clear browser cache:

<META Http-Equiv="Cache-Control" Content="no-cache">
<META Http-Equiv="Pragma" Content="no-cache">
<META Http-Equiv="Expires" Content="0">

Regards,

Solution

Marco Arede wrote:

Hi Anand,

You can block the browser back button, or clear the browser cache when user does logout.

Block back button:

$().ready(function() {
    if(document.referrer != 'http://localhost:8181/'){ 
        history.pushState(null, null, 'login');
        window.addEventListener('popstate', function () {
            history.pushState(null, null, 'login');
        });
    }
});

Or clear browser cache:

<META Http-Equiv="Cache-Control" Content="no-cache">
<META Http-Equiv="Pragma" Content="no-cache">
<META Http-Equiv="Expires" Content="0">

Regards,


@Marco , Thanks for the quick response,

Can you please elaborate how/where to use that block back button ?
 or clear cache script ?
onclick  event ( of logout button) ?

Also  about this

document.referrer != 'http://localhost:8181/'

normally using web app in browser the url looks like https://<DomainName>.outsystemscloud.com.

so is there any need to make any change in your code or shall i use it as same

Also in this

 history.pushState(null, null, 'login');

does 'login' here represent name of Login screen element ?

Thanks lots

try clearing the browser history:

if ( window.history.replaceState ) {
     window.history.replaceState ( null, null, null );
}