how to stop caching html but keep caching other resources - html

i want the browsers to cache only images but not the html document, because when i modify the .html the browser shows the old version that is cached.
this is the manifest.appcache specified in < html manifest="manifest.appcache" >:
CACHE MANIFEST
SETTINGS:
prefer-online
NETWORK:
*
FALLBACK:
CACHE:
/img/cap.gif
/img/descarga(53).gif
/img/descarga(3).gif
/img/descarga(7).gif
i have tried specify the http headers
Cache-Control:no-cache, max-age=0
Expires:to a date equal to the date header,1 minute in the future and a date 1 year in the past
Pragma:no-cache
and as i saw in other question i set the tags in the html head:
meta http-equiv="cache-control" content="max-age=0"
meta http-equiv="cache-control" content="no-cache"
meta http-equiv="expires" content="0"
meta http-equiv="expires" content="Tue, 01 Jan 1980 1:00:00 GMT"
meta http-equiv="pragma" content="no-cache"
but none of this work, the browser does cache the images and the html, there is another solution to this?, thanks.

Place this in the .htaccess this stoped cahcing of the specific file type
<filesMatch "\.(jpeg,png)$">
FileETag None
<ifModule mod_headers.c>
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
</ifModule>
</filesMatch>

Related

My website still loads from cache after multiple tries to disable it

I have been struggling with this problem when my site loads from cache when I(and the users) load it. I added these meta tags to my html to prevent this:
<meta http-equiv="cache-control" content="max-age=0" />
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="pragma" content="no-cache" />
But it did not work. Then I added these to the .htaccess file:
<IfModule mod_headers.c>
Header set Cache-Control "no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires 0
</IfModule>
<FilesMatch "\.(css|flv|gif|htm|html|ico|jpe|jpeg|jpg|js|mp3|mp4|png|pdf|swf|txt)$">
<IfModule mod_expires.c>
ExpiresActive Off
</IfModule>
<IfModule mod_headers.c>
FileETag None
Header unset ETag
Header unset Pragma
Header unset Cache-Control
Header unset Last-Modified
Header set Pragma "no-cache"
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Expires "Thu, 1 Jan 1970 00:00:00 GMT"
</IfModule>
</FilesMatch>
It did not work either.
I added a ?Version= with a random number to my links, it won't work either.
I even disabled the website loading from cache in the browser, but it still loads from cache.
What can I do to finally stop the website from loading from the cache? Some browsers display it correctly for me(firefox for example) but Opera, which i use the most won't.
EDIT: It seems like it smashes more versions together. For example i tested it: when I change a text it changes but, some colors for example won't change.
You should try looking into the browser's settings. Seems like they're the main reason for your trouble (since some browsers display it correctly and some do not)

Browser + server side cache clear not working

I'm using a web page builder that I've purchased and I've modified it to make it run on a web server instead of a local computer. The way the page builder stores the data is by using LocalStorage.
Im writing all localstorage data to a database and on load I clear browser localstorage with "window.localStorage.clear();" then I write new localstorage using the data saved before.
In general this works but I'm having some difficulties forcing the browser to display the latest content but it will eventually show after a few refreshes.
I found this code to put in .htaccess:
<filesMatch "\.(html|htm|js|css)$">
FileETag None
<ifModule mod_headers.c>
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</ifModule>
</filesMatch>
and I'm using these meta tags:
<meta http-equiv="Pragma" content="no-cache">
<meta http-equiv="Expires" content="-1">
<meta http-equiv="CACHE-CONTROL" content="NO-CACHE">
It seems like this did the trick in Chrome but firefox is still not showing the correct content.
Locally the code works great, the problem appeared after uploading it to a web server.
Any suggestions?
Thanks in advance

How to turn off caching of your website in chrome?

I'm trying to prevent caching of confidential files on the browser(chrome), so every time a request is made, fetch the files from the server, instead of viewing from cache. I added the following html meta tags, to instruct the chrome browser to not cache, but with no luck.
<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" />
upon inspecting the network traffic, cache-control is set to max-age=0 on request. and private on response.
I have this working for IE though.
Normally you would rather do this in the .htacces file, based on filetype (or any other pattern), example:
<IfModule mod_headers.c>
<FilesMatch "\.(jpg|jpeg|png|gif|swf)$">
Header set Cache-Control "max-age=604800, public"
</FilesMatch>
<FilesMatch "\.(js|css)$">
Header unset ETag
Header set Cache-Control "max-age=0, no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires "Wed, 11 Jan 1984 05:00:00 GMT"
</FilesMatch>
</IfModule>
Replace my simple example with a pattern of your choice. Also for reference here is more detail information on this topic: http://www.askapache.com/htaccess/using-http-headers-with-htaccess.html

Bad values in meta tags

I've got a problem when I pass the html5 validator to my site from w3c validator. The errors are next:
Bad value Content-Script-Type for attribute http-equiv on element meta
<meta http-equiv="Content-Script-Type" content="text/javascript" >
Bad value expires for attribute http-equiv on element meta
<meta http-equiv="expires" content="Wed, 26 Feb 1997 08:21:57 GMT" >
Bad value pragma for attribute http-equiv on element meta
<meta http-equiv="pragma" content="no-cache" >
Bad value Cache-Control for attribute http-equiv on element meta.
<meta http-equiv="Cache-Control" content="no-cache" >
What are the correct values to meta tags to pass html5 validator?
For HTML5 you use a cache manifest file in the header.
This is an example of how to use:
http://www.w3.org/TR/html5/browsers.html#manifests
Also, you force no cache with this:
<meta http-equiv="expires" content="0">
This is a good tutorial on how to use the cache manifest file:
https://www.html5rocks.com/en/tutorials/appcache/beginner/#toc-manifest-file-creating
The accepted answer is wrong! This is a good answer.
To quote Alohci:
Putting caching instructions into meta tags is not a good idea, because although browsers may read them, proxies won't. For that reason, they are invalid and you should send caching instructions as real HTTP headers.
Addendum:
For Apache and .htaccess you could use
<ifmodule mod_expires.c>
ExpiresActive On
ExpiresDefault value or
ExpiresByType text/css "access plus 1 month"
...
</IfModule>
PHP have headers_sent() and header() function for that.
function header_no_cache () {
\header('Cache-Control: no-cache, no-store, must-revalidate'); // HTTP 1.1.
\header('Pragma: no-cache'); // HTTP 1.0.
\header('Expires: 0'); // Proxies.
}
Point is that caching instructions should be in header. Not in html file.

What's the most correct way of stopping my pages from caching?

Google is giving me mixed responses, so I am guessing it is highly browser subjective, but what would you recommend I put in (and also where) to stop pages caching?
It's been a while, but when I used to do a lot of this, the advice was always to:
Set:
Cache-Control: no-cache
Expires: -1
Cache-Control: max-age -1
Here's a good article about the various nuances.
I've used:
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Cache-Control" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="0">
Response.CacheControl = "no-cache"
Response.AddHeader "Pragma", "no-cache"
Response.Expires = -1
or in ASP.NET, place this in your code behind (page or master page)
Response.Cache.SetExpires(DateTime.UtcNow.AddMinutes(-1))
Response.Cache.SetCacheability(HttpCacheability.NoCache)
Response.Cache.SetNoStore()