CODEWITHSUNDEEP
htmlbrowser-cachepage-refresh
DannyD
DannyD

Reputation: 2901

how do I reset the browser cache when reloading a page

I have a page that I'm changing however, the changes can only be seen when I reset my browser cache. Is there something I could add to my html which would do this?

Upvotes: 0

Views: 313

Answers (5)

ajp15243
ajp15243

Reputation: 7960

There's no way to actually clear a browser's cache from a page or its resoruces. There are ways around this, however.

One way is to append a "version number" to your resource files. This tricks the browser into thinking the resource is a different file, and will download it again. This question has some answers that can help you do that. The query string method is probably the easiest to control and maintain, if you use server-side code like PHP/JSP/ASP.NET to generate a unique version number to put into the query string. Note that you would have to build it to not happen in production, otherwise your users will be forced to reload resources with every page request, which will increase load times for them.

Another alternative, since you are developing, is to use some developer tools on your browser to disable your cache:

  • Chrome Developer Tools has native support for this. See this question's accepted answer for how to disable the cache in Chrome. Note that you have to have your developer tools open in Chrome for cache disabling to work.
  • Firefox has several ways to do this, as enumerated in this question on SuperUser.
  • Internet Explorer's developer tools support this as well, as is evident in this question on SuperUser. You may have to keep the developer tools open for this to stay in effect.

If you use a different (or a variety of) browser for development/testing, you should be able to Google how to disable the cache on that respective browser.

Firefox and Chrome also support Ctrl+Shift+R, or Shift+F5 for cache-less page reloads.

Upvotes: 0

user2184697
user2184697

Reputation:

You should be able to do this with plain HTML with "meta" tags. Meta tags belong to the "header" tag and are used for many different things, including to prevent cache and expiring the content de-facto.

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

These are 2 good tags for that. Good browsers should recognize them.

Upvotes: 1

Joel Peltonen
Joel Peltonen

Reputation: 13432

Depends on the resource that you need to reload. There are many different methods you could use, one common one is to use versioning or timestamping the request. So when you get the files that need to bypass the cache you request them using a timestamp for example like so (Exaple using C# + Razer).

<script src="/Js/[email protected]" type="text/javascript"></script>

Upvotes: 0

Colin James Firth
Colin James Firth

Reputation: 144

A trick I sometimes use is to add a parameter to the linked file. So, if it's the stylesheet you want to update, use something like screen.css?version=123. You can then update it to 124, and the browser will forget it's cached version and fetch it again. Be careful not to update too often on a live site - you'll ruin your user's lives if they have to download your core resources every time they visit.

Doing it this way means you'll only have to work on one named version of your file. Which keeps it simple.

Upvotes: 0

karlingen
karlingen

Reputation: 14645

If it's to view css or js changes one way is to append _versionNo to the css/js file for each release. E.g.

script_1.0.css script_1.1.css script_1.2.css etc.

You can check out this link to see how it could work.

Source: Force browser to clear cache

Upvotes: 1

Related Questions