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

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)

Related

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

how to stop caching html but keep caching other resources

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>

New webpage not being shown

I have a web development question.
Sometimes, if I place a new version of a webpage on a webserver, and I browse to this webpage, the new page is not shown. Instead the old page is shown, from the cached page from a previous browse to the webpage.
How can I get the new page to always be shown? Is there a tag of some sort that I can use for this?
There are some tags you can use
See http://www.i18nguy.com/markup/metatags.html
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="EXPIRES" CONTENT="0">
<META HTTP-EQUIV="PRAGMA" CONTENT="NO-CACHE">
There are similar HTTP headers that the web server can set as well.
Yes, you can specify no caching and how long to cache individual files in .htaccess if you are using Apache. Typically you would disable caching on dynamic content and set caching limits to the usual update rate of images and static html. On my site I regenerate the static html every day so have set caching to 24 hours on .html and disabled caching on PHP scripts (these limits are specified in seconds - 1 day = 86,400 seconds):
# Set up caching on media files for 1 week
<FilesMatch "\.(gif|jpg|jpeg|png|js|css)$">
ExpiresDefault A604800
Header append Cache-Control "public"
</FilesMatch>
# Set up 1 Day caching on site generated files
<FilesMatch "\.(xml|txt|html)$">
ExpiresDefault A86400
Header append Cache-Control "proxy-revalidate"
</FilesMatch>
# Force no caching for dynamic php
<FilesMatch "\.php$">
ExpiresActive Off
Header set Cache-Control "private, no-cache, no-store, proxy-revalidate, no-transform"
Header set Pragma "no-cache"
</FilesMatch>
If you are just having problems testing changes to your html files, remember that you can usually force a browser to reload the page regardless of cache settings - [Ctrl][F5] under Windows.
I think the server still haven't update the site. Just wait and see if it updates.

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.