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

Anand Das

Solved

Question

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

tab.PNG

26 Oct 2018

Marco Arede

MVP

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 != 'https://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,

26 Oct 2018

3 replies

Last reply 27 Dec 2019

Show thread

Hide thread

Anand Das

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 != 'https://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 != 'https://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

26 Oct 2018

Divya Nayak

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,

for clearing cache how can we use this code .

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

24 Dec 2019

Nikhil Gaur

Divya Nayak wrote:

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,

for clearing cache how can we use this code .

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

Hi Divya,

Instead of clearing the cache you can use below solution, it will run your prepration forcefully when browser back button it pressed.

https://www.outsystems.com/forums/discussion/45793/clicking-the-browser-back-button-after-logout/#Post167830

27 Dec 2019

Arley Silveira

try clearing the browser history:

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

26 Oct 2018

Community GuidelinesBe kind and respectful, give credit to the original source of content, and search for duplicates before posting.

See the full guidelines