开发者

Reload the page on hitting back button

开发者 https://www.devze.com 2023-01-14 06:46 出处:网络
I have a webpage that requires login. Once a user has logged in I start the session and once he logs out I destroy it, but when I press the back page it gives me the user profile page again which idea

I have a webpage that requires login. Once a user has logged in I start the session and once he logs out I destroy it, but when I press the back page it gives me the user profile page again which ideally should not be the case as the user has logged out. However, it works fine if I reload the page after logging out.

It's a local chatroom where everybody online and logged in can chat together. There are three pages: login.php, auth.php, logout.php

login.php is the common login pa开发者_开发百科ge containg a form. auth.php has a div displaying all previous chats up til now, a textbox and share button on clicking which a form is sent again to auth.php so everytime the form is posted the chatpost is sent to database and auth is reloaded with the latest database within the chat div..

Now the problem is once I logout I unset all the variables and destroy the session but even then if I hit the back button in browser (Safari), the previous version of auth.php without the last chat entry is visible which ideally should not as the session is destroyed. I have put a session validation in auth.php, so basically I want the auth.php to reload of the user visits it after logging out as reloading auth.php displays that "you are not logged in"

i have tried

<?php header("Cache-Control: no-cache");
header("Pragma: no-cache");
?>
and
<head>
<meta http-equiv='Pragma' content='no-cache'>
<meta http-equiv='Expires' content='-1'>
</head>

Sorry for the lengthy question but I really need help on this.


header("Expires: Thu, 19 Nov 1981 08:52:00 GMT"); //Date in the past
header("Cache-Control: no-store, no-cache, must-revalidate"); //HTTP/1.1

This works for me on FF3.6, IE7, IE8, Chrome5 (when hitting browser's back/forth button the page is always RELOADED)

Another solution is to send exactly the same headers sent by session_start() function, very similar to the ones above, but even more rich:

header("Expires: Thu, 19 Nov 1981 08:52:00 GMT"); //Date in the past
header("Cache-Control: no-store, no-cache, must-revalidate, post-check=0, pre-check=0"); //HTTP/1.1
header("Pragma: no-cache");

NOTE: also the order shown here is the SAME as the order sent by session_start() (you can test this with HttpFox addon for FF)


These headers will force the browser, and proxies if any, not to cache the page and force a new request to the server for that page:

  header("Cache-Control: private, must-revalidate, max-age=0");
  header("Pragma: no-cache");
  header("Expires: Sat, 26 Jul 1997 05:00:00 GMT"); // A date in the past


For a pure javascript solution just add this to your HTML:

<input id="alwaysFetch" type="hidden" />
<script>
    setTimeout(function () {
        var el = document.getElementById('alwaysFetch');
        el.value = el.value ? location.reload() : true;
    }, 0);
</script>

The code simply assigns a value to the hidden input that will remain after the back button is clicked. This is then used to determined if the page is stale in which case it is reloaded.


Without changing the url, put this in the head tag.
The script uses two cookies:
- one to store if the page has been visited
- one to store if the reaload has been triggered

if(navigator.cookieEnabled){    
    var visited=0;
    var refreshing=0;
    if(Get_Cookie('visited')) {
        visited=parseInt(Get_Cookie('visited'));
    }
    if (Get_Cookie('refreshing')) {
        refreshing=parseInt(Get_Cookie('refreshing'));
    }
    if(visited==1){
        if(refreshing==0){
             window.document.cookie = 'refreshing=1';
             window.location.reload();
        }else{
             window.document.cookie = 'refreshing=0';
        }
    }else{
        window.document.cookie = 'visited=1';
    }
}


I'm using a mixed solution, as I did not find a cross-browser method to reload the page after hitting the backbutton.

Firstly, I add some meta tags to all of my pages:

<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="no-cache">
<meta http-equiv="Expires" content="-1">
<meta http-equiv="Cache-Control" content="no-cache">

Secondly,I add the following javascript on the tag in all of my pages:

<script type="text/javascript">    
// If persisted then it is in the page cache, force a reload of the page.
        window.onpageshow =function(event){
            if(event.persisted){        
                document.body.style.display ="none";        
                location.reload();
            }
        };
</script>

I am applying this fix in one of my websites and it is working fine in IE 10, Safari and Chrome.


I have tried many solutions but what worked for me is this simple line of code.

<body onunload="">

Add unload event with body tag and check your issue.

0

精彩评论

暂无评论...
验证码 换一张
取 消