2

Let's start with a typical PHP/html/JavaScript environment. Skipping past the <head> and <body> suppose we have:

<script>
    var foo = <?php echo generateFoo(); ?>;
</script>

Let's suppose this is working perfectly in every way, except for one minor flaw. That is, whenever I navigate away from the page and click "back", I get the old value of foo rather than an updated one.

I understand this error. Clicking "back" loads the page from the cache, not the server, so it returns to the previous value of PHP, not the current one. However, I want it to force update. (This is especially important because the user could be changing the value on another page, and someone who isn't an expert in html would expect "back" to take you to an updated version of the previous page. Code is always easier to change than user behaviour.)

What can I write that will function exactly like the code above, but will also execute when the user navigates back?

(I think the correct solution may use AJAX, but maybe I'm wrong. The page already uses AJAX from a jquery CDN, so I may as well make use of it if I can.)

Edit:

A solution that allows caching but just updates that one variable would be ideal. However if stopping caching is the only solution, I don't even know how to do that. So telling me how to do that would be good.

Copied directly from my code without alteration:

<?php

...

    header("Cache-Control: no-cache, no-store, must-revalidate");
    header("Pragma: no-cache");
    header("Expires: 0 ");
?>

So yes, I have already tried to stop caching. It isn't working in the BFCache.

Jonathon Philip Chambers
  • 439
  • 5
  • 25
  • 1
    Yes, you're right. You should fetch a new `foo` on every request. – fabrik Sep 25 '18 at 12:54
  • I suspected as much, but I couldn't find an example of ajax anywhere that wasn't updating the contents of a div box. I just don't know the correct syntax. – Jonathon Philip Chambers Sep 25 '18 at 12:55
  • Not sure that an Ajax request would solve your issue, though. If the page is loaded from the cache, it usually means that there won't be any "onload" event triggered either. So unless you force the user to click on a link/button to trigger the Ajax request, my bet is that you would end up with the same issue. – M. Eriksson Sep 25 '18 at 13:01
  • @MagnusEriksson well, that would certainly explain why I couldn't find a working example. – Jonathon Philip Chambers Sep 25 '18 at 13:02
  • 2
    This has been asked many times before and have gotten different suggestions and solutions, depending on the needs of the person asking. Do a google search for _"force page reload on back button"_ and check if any of the questions has a solution that works for you in your case. – M. Eriksson Sep 25 '18 at 13:04
  • @MagnusEriksson oh believe me I have. Each solution worked perfectly for the specific needs of that user, but each user had needs far away from mine. Worse still, most of the solutions only worked for some browsers. As for my particular needs, updating the entire page would be nice, but updating that one variable would be even better. – Jonathon Philip Chambers Sep 25 '18 at 13:06
  • You could try and send some headers to the browser on those pages, telling it not to cache them at all. Add the code from the accepted answer in the top of the pages you don't want to be cached: https://stackoverflow.com/questions/13640109/how-to-prevent-browser-cache-for-php-site. Then clear your browsers cache and see if that solves your issue. – M. Eriksson Sep 25 '18 at 13:12
  • I've already added very similar code to the header of my browser. As a result, it only caches in the BFCache (as far as I can tell). However, it still caches in the BFCache. Ideally I'd like to get rid of those headers because I'd actually like this page to be cached. I just want it to update that one javascript variable when it loads from the cache. (However, if stopping caching altogether is the only solution, so be it.) – Jonathon Philip Chambers Sep 25 '18 at 13:19

1 Answers1

3

Check out this thread and the code example: 

window.addEventListener("pageshow", function (event) {
  var historyTraversal = event.persisted || 
                         (typeof window.performance != "undefined" && 
                              window.performance.navigation.type === 2);
  if (historyTraversal) {
    // Reload the page.
    window.location.reload();
  }
});
Michael Hurley
  • 369
  • 2
  • 5
  • 15