Prevent Chrome from Caching Webpage

Question

I have a web url www.mywebpage.com/subpage?id=123 which contains:

<!DOCTYPE html> <html> <head> <meta http-equiv="Cache-Control" content="no-cache, no-store, must-revalidate"> <meta http-equiv="Pragma" content="no-cache"> <meta http-equiv="Expires" content="0"> <script> const queryString = window.location.search; console.log(queryString); const urlParams = new URLSearchParams(queryString); const identifier = urlParams.get('id'); window.location.replace("https://anotherwebpage.com/anothersubpage?id=" + identifier); </script> </head> <body> </body> </html>

All I am doing is taking the id and redirecting to another page, passing in that parameter. This works correctly, until I load the page with a different identifier. It seems that Chrome is still caching the page (in spite of the meta tags), so it redirects to the other page with the old identifier.

How do I ensure that this script runs on every single load of the page so it always redirects with the provided identifier?

You're code will always send the correct id, you are just clicking the same link, or to be more clear, only time it might cache is if you use the back button, if you want to ensure this doesn't happen here is a old post on how you can fix it stackoverflow.com/questions/30161191/… — Breezer
– Breezer, Commented Dec 5, 2022 at 1:09
That's what I would expect, but that's not when I'm observing: Step 1: In chrome, load website with the new identifier - see the older identifier being loaded. Step 2: In safari, load website with the new identifier - see the new identifier being loaded. I'm attempting to clear the cache in Chrome by going to Chrome -> Clear Browsing Data -> Cached Images & Files and Cookes and other site data but this has no effect. — Josh Gafni
– Josh Gafni, Commented Dec 5, 2022 at 1:11
added further information to be a little more clear on what i meant — Breezer
– Breezer, Commented Dec 5, 2022 at 1:12
Ahh it seems that the redirect is coming from CoudFront. The policy on the subpage in S3 is Cache-Control: no-cache, but it's still being cached by CloudFront. So subpage from first website is called with new identifier, and CloudFront redirects to the same subpage of the first website with the old identifier, and then it redirects to the subpage of the second website with the old identifier. The issue seems to be CloudFront... — Josh Gafni
– Josh Gafni, Commented Dec 5, 2022 at 1:26

Peter Thoeny · Accepted Answer · 2022-12-05 02:06:06Z

You can force the link to be different every time by adding a timestamp. Your example:

 window.location.replace('https://anotherwebpage.com/anothersubpage?id=' + identifier + '&t=' + new Date().valueOf());

Collectives™ on Stack Overflow

Prevent Chrome from Caching Webpage

1 Answer 1

Comments

Linked

Hot Network Questions

Collectives™ on Stack Overflow

1 Answer 1

Comments

Linked

Related