How to programmatically empty browser cache

Question

I am looking for a way to programmatically empty the browser cache  I am doing this because the application caches confidential data and I d like to remove those when you press  log out   This would happen either via server or JavaScript  Of course  using the software on foreign public computer is still discouraged as there are more dangers like key loggers that you just can t defeat on software level

User · Answer

There s no way a browser will let you clear its cache  It would be a huge security issue if that were possible  This could be very easily abused - the minute a browser supports such a  feature  will be the minute I uninstall it from my computer    What you can do is to tell it not to cache your page  by sending the appropriate headers or using these meta tags    lt meta http-equiv  cache-control  content  no-cache  gt   lt meta http-equiv  expires  content  0  gt   lt meta http-equiv  pragma  content  no-cache  gt    You might also want to consider turning off auto-complete on form fields  although I m afraid there s a standard way to do it  see this question    Regardless  I would like to point out that if you are working with sensitive data you should be using SSL  If you aren t using SSL  anyone with access to the network can sniff network traffic and easily see what your user is seeing   Using SSL also makes some browsers not use caching unless explicitly told to  See this question

User · Answer

Here is a single-liner of how you can delete ALL browser network cache using Cache delete   caches keys   then  keyList    gt  Promise all keyList map  key    gt  caches delete key      Works on Chrome 40   Firefox 39   Opera 27  and Edge

User · Answer

You can now use Cache delete    Example   let id    your-cache-id      you can find the id by going to     application gt storage gt cache storage      minus the page url at the end     in your chrome developer console   caches open id   then cache   gt  cache keys      then keys   gt        for  let key of keys          cache delete key                 Works on Chrome 40   Firefox 39   Opera 27  and Edge

User · Answer

On Chrome  you should be able to do this using the benchmarking extension  You need to start your chrome with the following switches     chrome --enable-benchmarking --enable-net-benchmarking    In Chrome s console now you can do the following   chrome benchmarking clearCache    chrome benchmarking clearHostResolverCache    chrome benchmarking clearPredictorCache    chrome benchmarking closeConnections      As you can tell from above commands  it not only clears the browser cache  but also clears the DNS cache and closes network connections  These are great when you re doing page load time benchmarking  Obviously you don t have to use them all if not needed  e g  clearCache   should suffice if you need to clear the cache only and don t care about DNS cache and connections

User · Answer

x000D   x000D    The code below should be put in the  js  folder with the name  clear-browser-cache js  x000D   x000D   function      x000D      var process scripts   false  x000D      var rep             x000D      links   document getElementsByTagName  link    x000D      scripts   document getElementsByTagName  script    x000D      var value   document getElementsByName  clear-browser-cache    x000D      for  var i   0  i  lt  value length  i      x000D          var val   value i   x000D              outerHTML   val outerHTML  x000D          var check      value  true      x000D          if  check test outerHTML     x000D              process scripts   true  x000D            x000D        x000D      for  var i   0  i  lt  links length  i      x000D          var link   links i   x000D          href   link href  x000D          if  rep test href     x000D              link href   href     amp     Date now    x000D            x000D          else   x000D              link href   href         Date now    x000D            x000D        x000D      if  process scripts    x000D          for  var i   0  i  lt  scripts length  i      x000D              var script   scripts i   x000D              src   script src  x000D              if  src           x000D                  if  rep test src     x000D                      script src   src     amp     Date now    x000D                    x000D                  else   x000D                      script src   src         Date now    x000D                    x000D                x000D            x000D        x000D        x000D  At the end of the tah head  place the line at the code below x000D   x000D       lt  script name  clear-browser-cache  src  js clear-browser-cache js  value  true   gt  lt   script  gt  x000D   x000D   x000D

User · Answer

use html itself There is one trick that can be used The trick is to append a parameter string to the file name in the script tag and change it when you file changes    lt script src  myfile js version 1 0 0  gt  lt  script gt   The browser interprets the whole string as the file path even though what comes after the     are parameters  So wat happens now is that next time when you update your file just change the number in the script tag on your website  Example  lt script src  myfile js version 1 0 1  gt  lt  script gt   and each users browser will see the file has changed and grab a new copy

User · Answer

The best idea is to make js file generation with name   some hash with version  if you do need to clear cache  just generate new files with new hash  this will trigger browser to load new files

User · Answer

Initially I tried various programmatic approach in my html  JS to clear browser cache  Nothing works on latest Chrome   Finally  I ended up with  htaccess    lt IfModule mod headers c gt      Header set Cache-Control  no-cache  no-store  must-revalidate      Header set Pragma  no-cache      Header set Expires 0  lt  IfModule gt    Tested in Chrome  Firefox  Opera  Reference  https   wp-mix com disable-caching-htaccess

User · Answer

location reload true   will hard reload the current page  ignoring the cache   Cache delete   can also be used for new chrome  firefox and opera

User · Answer

Imagine the  js files are placed in  my-site some path ui js myfile js  So normally the script tag would look like    lt script src   my-site some path ui js myfile js  gt  lt  script gt    Now change that to    lt script src   my-site some path ui-1111111111 js myfile js  gt  lt  script gt    Now of course that will not work  To make it work you need to add one or a few lines to your  htaccess The important line is   entire  htaccess at the bottom   RewriteRule  my-site        ui -  0-9          my-site  1 ui  3  L    So what this does is  it kind of removes the 1111111111 from the path and links to the correct path    So now if you make changes you just have to change the number 1111111111 to whatever number you want  And however you include your files you can set that number via a timestamp when the js-file has last been modified  So cache will work normally if the number does not change  If it changes it will serve the new file  YES ALWAYS  because the browser get s a complete new URL and just believes that file is so new he must go get it   You can use this for CSS  favicons and what ever gets cached  For CSS just use like so   lt link href  http   my-domain com my-site some path ui-1492513798 css page css  type  text css  rel  stylesheet  gt    And it will work  Simple to update  simple to maintain      The promised full  htaccess   If you have no  htaccess yet this is the minimum you need to have there    lt IfModule mod rewrite c gt      RewriteEngine On     RewriteBase        RewriteRule  my-site        ui -  0-9          my-site  1 ui  3  L   lt  IfModule gt

User · Answer

It s possible  you can simply use jQuery to substitute the  meta tag  that references the cache status with an event handler   button  and then refresh  easy        button   click function           ajax           url              context  document body          success  function s x                   html manifest saveappoffline appcache    attr  content                          this  html s                            NOTE  This solution relies on the Application Cache that is implemented as part of the HTML 5 spec  It also requires server configuration to set up the App Cache manifest  It does not describe a method by which one can clear the  traditional  browser cache via client- or server-side code  which is nigh impossible to do

[javascript] How to programmatically empty browser cache?

Examples related to javascript

Examples related to html

Examples related to caching

Examples related to browser