1

I have a simple test web site with 2 different pages, Page1 and Page2. Pages are generated by a web server.

All responses contain these headers:

Cache-control: no-cache, no-store, must-revalidate
Pragma: no-cache

Page1 contains a link to Page2 and a TextArea element, enclosed in a FORM tag. Page2 is a blank page (it doesn't contain anything useful). Clicking on the Page2 link (inside Page1) will submit the form (and TextArea value) to the server and switch to Page2. Each time Page1 is requested from the server, a new line is added to the TextArea. This happens at server-side (no DOM manipulation via JavaScript, at browser side).

So, when application starts, Page1's TextArea contains:

"Line 1"

If I click on the link to Page2 and then hit the back button, Page1's TextArea now contains 2 lines, as expected:

"Line 1"
"Line 2"

This shows 2 things:

  • BFCache (Back-Forward cache) is not being used (because each time the back button is hit, a new request is sent to the web server). It can also be confirmed by the fact that pageshow's event parameter persisted property is false.
  • The browser is updating the page correctly (because new content added to the page, at server-side, is being shown at browser side, as expected)

However, if I clear the text area, click on the same link to Page2 and then hit the back button, the TextArea will still show an empty content. I would expect it to show exactly one line of text (inserted by the server). This happens in all tested browsers, including WebKit, FireFox and even Internet Explorer.

Using Network tab from Developer Tools I can see that the server responds with the correct content and the preview sub-tab (in dev tools/network) shows exactly that.

So, in the second scenario, the browser is definitely retrieving the updated content from server, but refuses to update the page with that content. Seems to me that whenever the page is submitted, the browser will use the submitted page when the user hits the back button, regardless of content updated at server-side.

This issue is very similar to another here: How to prevent content being displayed from Back-Forward cache in Firefox? with same symptoms but in that case there is no form submit and change in response headers would fix it.

My questions:

a) Why browsers retrieve an updated content from the server but don't use it to update the page in that particular scenario? Is it a documented behavior?

b) Is there a way to change this behavior? I'm particularly thinking about a way to force the browser to update the page with the response from the server (the same way it occurs when no submitting is involved).

BTW, submitting the form in an AJAX request is not a solution but merely a workaround for this issue, having in mind that a full post back may be needed in some scenarios.

Alexandre M
  • 1,146
  • 12
  • 23
  • Sounds like you have a issue in your code not with the browser cache, Can you show your code and also it will be very helpful if u can create a live URL for testing purpose. I will love to solve this problem. Thanks – Aabir Hussain Sep 29 '20 at 20:17
  • I'll see if I publish a demo online but that's not a problem in the code. As I mentioned above, the developer tools network tab clearly shows that the request/response are transmitted correctly. The contents of the response clearly shows that it has been generated correctly by the server application. The issue is a browser behavior. Regarding the source code, it is a C++ server application, not a PHP/Python or any other simple testable app – Alexandre M Sep 30 '20 at 02:00
  • @AlexandreM i appreciate what you are doing but as a well wisher i ll recommend you not to waste time on building things from basic technologies like html css instead you sould be using frameworks. if you are doing research then its OK but if you are developing something then you should definetly change your approach. frameworks saves a lot of time. – Harkal Sep 30 '20 at 19:41
  • would you show or tell what actually happens on form submission ? what does the server reponds with in both the senerios ? – Harkal Sep 30 '20 at 19:51
  • 1
    @Harkal I appreciate you trying to help but the whole point of SO is not searching for recommendation, but for answers to very specific and direct questions. I'm trying to understand the behavior of the browser and identify any documentation that explains it. – Alexandre M Sep 30 '20 at 20:24
  • @AlexandreM ok would you show or tell what actually happens on form submission ? what does the server reponds with in both the senerios ? – Harkal Sep 30 '20 at 21:08
  • This looks similar to https://stackoverflow.com/questions/17970601/how-to-prevent-form-fields-from-repopulating-after-clicking-the-back-button Did you try the autocomplete=off option? – Ian Pilipski Oct 01 '20 at 00:58
  • any luck ? m waiting for your edit – Aabir Hussain Oct 07 '20 at 18:03

0 Answers0