Google Chrome Cache - google-chrome

I have an html page that embeds a flash (flex) application.
I have the following headers:
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-CACHE">
<META HTTP-EQUIV="CACHE-CONTROL" CONTENT="NO-STORE">
<META HTTP-EQUIV="Pragma" CONTENT="no-cache">
<META HTTP-EQUIV="Expires" CONTENT="-1">
In addition, each time I release a new version of the app, I change the file name. So, it becomes something like MyApp_v1.swf, which is then updated to MyApp_v2.swf.
Despite this, chrome still caches the html page and the swf file. This is a major problem, as clients do not then see the updated swf unless they clear their browser cache.
I even tried to get around this with changing the htaccess file, and renaming the index.html file that hosts the swf file:
RewriteEngine On
RewriteCond %{HTTPS} !=on
RewriteRule ^(.*)$ https://www.mysite.com/app[R,L]
DirectoryIndex index.html #this was changed from myapp.html
Even after doing this, Chrome still caches the swf, and is STILL reading from the old html file. I do a view source on the html, and its still showing the old file.
This all works fine in any other browser.

These two bug reports relate, some good relevant information in here:
Issue 28035 - chromium - Cache doesn't adhear to No cache options ( google crome )
Issue 64139 - chromium - Cache isn't revalidated properly, no-cache directive
Another solution may be to add specific cache-control or pragma HTTP headers as mentioned in the links above
Also, dumb question, did you clear chrome cache before testing your <meta> no-cache tags? wondering if it is still using cache from before your changes.

For all you guys struggeling with this
i found something simple that works...
i tried
1. ctrl + f5
2. ctrl + shift + 5
3. setting the "no cache" in developer tools..
What worked for me in the end is to
Just hold the CTRL key while you click the reload icon!

Use this "no-store" extra tag, and the cache works fine in Chromium (Chrome) as in the other capable browsers:
header("Cache-Control: no-cache, no-store, must-revalidate");
header("Pragma: no-cache, no-store");

Related

.html Caching in HTML

I have a web application published on IIS. All of my JS files are called from my static html file called "Index.html". In that html file, I call each JS file with the <script> tag, and in order to manage our versions and perform updates without user's history and cache deleting, I've added the ?v={version} at the end of each JS file's URL as the following:
<script src="./app.js?v=20161226.1" />
After multiple version updates, I've noticed that the users still need to refresh the page in order to get the latest Index.html file. After searching the Developer Tools of chrome, and looking in the Network section in the Developer Tools, I've managed to notice that the Index.html file is loaded from the cache (shown the "(from cache)" sign in the Network).
After searching the web for any solution for uncaching .html files (Because there is no ?v={version} for my .html file), I've found that adding:
<meta http-equiv="cache-control" content="no-cache" />
<meta http-equiv="expires" content="0" />
<meta http-equiv="pragma" content="no-cache" />
isn't solving the issue and the my Index.html file is still loaded from the cache.
I'm updaing my web application each two weeks and I can't afford myself letting the users deleting the cache and history each version update because the new and latest .html file is loaded because it is cached.
The only thing that helps is refreshing (F5) and then the Index.html file is reloaded (Not loaded from cache and the latest version of that Index.html file is shown). But if someone types the url and enters it in the URL-bar, the Index.html is still loaded from the cache.
Is there anything I've done wrong and should add anything else?
Is there anything to do to solve this issue at all?
Thanks!
Putting a query string on the end of a URL is a (good) hack to allow you to set the HTTP cache control headers to cache for a long time for infrequently changed resources and still force the new version to load on those occasions that you do change it.
If you are frequently updating your HTML, then just set the cache control headers to tell the browser to check for updates more frequently. Take advantage of Etags or If-Modified-Since instead of depending on an Expires header set far in the future.
NB: You have to use real HTTP headers. <meta http-equiv> is a bad joke.

IE11 caching breaking status page

I have a status page that needs to be constantly refreshed. It makes ajax calls to a Java server and gets the updated statuses. It works perfectly in Chrome, but in IE11 it is not refreshing when I click refresh. However, when I open the dev tools, it does work. As soon as I close dev tools, it stops working. I have the following meta tags in my head:
<meta http-equiv="cache-control" content="no-cache, must-revalidate, post-check=0, pre-check=0">
<meta http-equiv="expires" content="0">
<meta http-equiv="pragma" content="no-cache">
And it won't be enough to set my own browser to not use caching; I need it to work for users without them having to change their browser settings.
According to this, https://support.microsoft.com/en-us/kb/234067, there is a bug in IE around this. https://support.microsoft.com/en-us/kb/222064 explains it. Maybe you're hitting that? I would also say you should make sure your meta tags are at the top of the head section.
Alternatively, I think the best solution would be to use HTTP headers. I've had very good results with cache HTTP headers.
I found a solution: Apparently, IE caches ajax calls, so that needs to be disabled. Adding 'cache: false' to the ajax call fixes the issue:
$.ajax({
url: www.url.com,
cache: false
})

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.

Load index.html every time from the server and NOT from cache

I have a webpage index.html hosted on a particular server. I have pointed example.com to example.com/index.html. So when I make changes in index.html and save it, and then try to open example.com, the changes are not reflected. Reason that the webpages are being cached.
Then I manually refresh the page and since it loads the fresh copies and not from cache, it works fine. But I cannot ask my client to do so, and they want everything to be perfect. So my question is that is there a trick or technique as to how I can make the file load every time from the server and not from cache?
P.S: I know the trick for CSS, JS and images files, i.e. appending ?v=1 but don't know how to do it for index.html.
Any help would be appreciated. Thanks!
by this:
<meta http-equiv="expires" content="0">
Setting the content to "0" tells the browsers to always load the page from the web server.
The meta tags didn't worked for me so. i set the headers from the java class that implements filter or controller. and it worked. here is the code
HttpServletResponse httpResponse = (HttpServletResponse) response;
httpResponse.setHeader("Cache-Control", "no-cache, no-store, must-revalidate"); // HTTP 1.1
httpResponse.setHeader("Pragma", "no-cache"); // HTTP 1.0
httpResponse.setDateHeader("Expires", 0); // Proxies.
There are only two most reliable way available as of 2018
1) **<meta http-equiv="expires" content="0">** Use this meta tag but be careful because this tag destroy the all cache of the page as soon as a web page processed by browser.
2) Generate an unique ID at server for each page request and append this id at the end of the all file name inside the HTML document with ? before the unique id append on images, documents, css/js files, videos etc which need to be load from the server every time. For example if you have the HTML tag like <img src="images/profile223.jpg" alt="profile picture"> then on server side append the unique id at the end of the file name like this echo '<img src="images/profile223.jpg?'.$uniqueid.'"" alt="profile picture">'; . In this example i use php but you can generate the unique ID on any language. All big companies like Google, Facebook, Microsoft, Twitter etc. uses this technique because it is most effective way and does not effect the cache data you want to store on user browser like login session id. This technique is cross browser compatible and support older version of IE, Firefox, Chrome, Safari and Opera. You may append the unique id at the end of the url using the same technique
You can try this below method. It worked for me.
Please add the below lines of code in your .htaccess file.
<IfModule mod_headers.c>
<FilesMatch "\.(html|php)$">
Header set Cache-Control "no-cache, no-store, must-revalidate"
Header set Pragma "no-cache"
Header set Expires 0
</FilesMatch>
<FilesMatch "\.(ico|pdf|jpg|png|gif|js|css)$">
Header set Cache-Control "max-age=172800, public, must-revalidate"
</FilesMatch>
</IfModule>
If you use the above code, browser will not cache .html files.
Adding this meta tags to the header works for most of the browsers (in that case index.html will not be cached):
<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" />
A bit late but it might help someone else!
You can send extra headers with the file to tell the client (the browser, that is) that the file must not be cached. If you got Apache, take a look at mod_expires. If you use a server side scripting language, like PHP, you can solve it using that too.
i ever meet this problem with my website. in your URL add the q=''
http://yoururl.com/somelinks?q=fill_with_random_number
for me, it works
I highly recommend not using meta tags and use htaccess as Murali Krishna Bellamkonda posted. That will always be the best and most secure dependable way. You can fine tune your whole system to stay cached for long times, refresh files at specific times, etc...
Go ahead and try all them meta tags at once, and see what happens! (no I wouldnt)
Look into Header set Cache-Control "max-age=5, immutable" with ExpiresDefault A5 for a no cache option.

Opera neglects the caching directives in the header

Having already read this question I haven't managed to figure out what the problem is with my web page http://opentox.ntua.gr/vlab/pid/ being cached by Opera. This is how to reproduce the problem:
Navigate to http://opentox.ntua.gr/vlab/pid/ using Opera (version 11.60, build 1185, for Linux)
Don't change any parameters - just click run. Wait a second and you'll get some diagrams.
Now check the checkbox "Open Loop" and click Run again. You should get different results but you don't. The images are cached and they are not reloaded.
Force reload of the first image: Right click on the image and click "Reload Image". You will notice that the reloaded image and has changed...
Now go to Tools > Preferences > Advanced > History. And Set "Memory Cache" to "Off", "Check Documents" to "Always" and "Check Images" to "Always". Click also "Empty now" and exit. Then, the problem is resolved. Is there a way to force Opera to reload the images by specifying a proper header of the HTML document rather that having the users change their configurations globally?
Note that the problem does not reproduce with other browsers and the HTML document already includes in its header the following directives:
<meta http-equiv="Pragma" content="no-cache"/>
<meta http-equiv="CACHE-CONTROL" content=
"no-store, no-cache, must-revalidate,
post-check=0, pre-check=0, max-age=0"/>
<meta http-equiv="Expires" content="0"/>
Graphic files have there own headers with caching information witch in your case tells opera it's ok to use cached files - you can check headers using for example firebug for ff.
Try adding something like this inside your .htaccess
More about this here http://httpd.apache.org/docs/2.0/mod/mod_expires.html
<IfModule mod_expires.c>
ExpiresActive On
ExpiresByType image/gif "access plus 1 second"
ExpiresByType image/jpeg "access plus 1 second"
ExpiresByType image/png "access plus 1 second"
</IfModule>
It should work but probably there's a cleaner way to write it - I'm not an expert on .htaccess.
You may also serve files through a php script with first spits a proper header with no-cache and then writes out gifs read from hd.
Hope this helps.