How do I force a favicon refresh

Question

I have a Grails application running locally using its own tomcat and I have just changed the favicon for a new one   Problem is that I can not see it in any browser   The old favicon shows up or I get no favicon at all  but not my new one   I do not think this is a Grails issue per se  more an issue with favicons   What is supposed to happen with favicons   How are they supposed to work   I have numerous bookmarks in my browser which have the wrong icons and they never seem to get refreshed   How do I force the server browser to stop caching them   It seems pretty silly to always cache them given they are normally only 16x16   Why not just upload them with every visit to the page  It is not exactly a huge overhead

User · Answer

Just change this filename  favicon1 ico

User · Answer

Try Opening In a New Tab  I tried many of the things above  resetting cache  refreshing  using the link tag  etc   I even checked my  htaccess file and reset the ExpiresByType variable   But this is what finally worked for me in both Chrome  25 0 x  and Safari  6 0 1     Flushing cache Hard-linking the favicon with the  lt link gt  tag Navigating to mysite com favicon ico Opening mysite com in a new tab    Up until step 3  refreshing in the same tab kept reproducing the old icon

User · Answer

I know this is a really old question but it is also one that is still relevant  though these days applies only to mozilla    I have no idea what explorer does coz we don t code for non standard browsers    Chrome is well behaved if one includes an icon tag in the header   Although mozilla are well aware of the issue  as usual  they never fix the annoying small stuff   Even 6 years later   So  there are two ways of forcing an icon refresh with firefox    Have all your clients uninstall firefox   Then re-install  Manually type just the domain in the url bar - do not use http or www just the domain  mydomain com     This assumes of course that your ns records include resolution for the domain name only

User · Answer

Simple   1  I don t want to fiddle around with codes  ps my site builder doesn t use codes  it uses  upload file  button and it does it itself   2  I tried the CTRL F5 and it doesn t work for me so      I HAVE A SOLUTION   IE  Clear All browser history and cookies by going to the settings cog O  Chrome  Go to the menu in the top right corner below the X that looks like a     then go to settings  history  CLEAR BROWSING DATA and check all of the boxes that apply  I did history  cookies and empty the catche from the beginning of time

User · Answer

More than likely a web browser issue   You will have to delete your cache from your browser  close your browser and reopen it   That should fix it   I don t believe your favicons will get refreshed on your favorites until you revisit that page  and assuming that you had previously cleared your browsers cache   Your web browser will not go out to the internet to check for a new favicon on its own    thank goodness

User · Answer

When you request the favicon from Google  you can take a look at the response headers   Last-Modified  Fri  09 Jan 2009 16 35 02 GMT Date  Thu  01 Dec 2010 00 00 01 GMT Expires  Fri  01 Dec 2011 00 00 01 GMT Cache-Control  public  max-age 31536000 Age  7   If you put an  Expires    header on the response  client browsers will re-request the icon after that timestamp   While doing active development  you could set the expires timestamp to a second or two in the future  and always have it fetch this  although that s a poor longterm plan

User · Answer

This answer has not been given yet so I thought I d post it   I looked all around the web  and didn t find a good answer for testing favicons in local development     In current version of chrome  on OSX  if you do the following you will get an instant favicon refresh    Hover over tab Right Click Select reload Your favicon should now be refreshed   This is the easiest way I ve found to refresh the favicon locally

User · Answer

Please follow below steps to change app icon    Add your  ico file in the project  Go to angular json and in that  projects  -   architect  -   build  -   options  -   assets  and here make an entry for your icon file  Refer to the existing entry of favicon ico to know how to do it  Go to index html and update the path of the icon file  For example     x000D   x000D   lt link rel  icon  type  image x-icon  href  abc ico  gt  x000D   x000D   x000D    Alternatively  rename your icon file with favicon ico and replace it in the directory    Restart the server  Hard refresh browser and you are good to go

User · Answer

Depending on the browser they are handled differently  but typically I find that going to the default page of the site  and doing a hard refresh   CTRL   F5  will typically get it to update

User · Answer

Chrome s favicon support is buggy - disregard this answer  I wrote this answer under the impression that this is what it took to refresh favicons in Google Chrome  However  it turns out that this only works for the first five minutes or so  until the icon gets irretrievably lost in Chrome s history synchronization   Original answer  You don t have to clear your cache  restart your browser  or rewrite your HTML - you just need to change the icon s URL  once  so that the browser will forget the previously-cached icon   Assuming that you ve defined your icon via  lt link gt  elements in your page s  lt head gt   you can do that by running this standard-JS one-liner in the console      slice call document querySelectorAll  head gt link rel   icon      map function ln  ln href    v 2       For a more advanced implementation of this that can automatically do this for end users in production  see freshicon js

User · Answer

Also make sure you put the full image URL not just its relative path   http   www example com images favicon ico   And not     images favicon ico

User · Answer

ON MAC      Shift-R or hold down Ctrl and click the reload button in the browser

User · Answer

If you are using PHP    then you can also use this line    lt link rel  shortcut icon  href  http   www yoursite com favicon ico v  lt  php echo time     gt     gt    It will refresh your favicon on each page load

User · Answer

By destroying the file your browser uses to store old favicons  you can force new ones to be loaded    Close your browser  Make sure there are no longer browser processes running  e g  check Task Manager for chrome exe or firefox exe   Navigate to where your browser stores user files    For Chrome  go to the Chrome data directory  For Firefox  go to the Firefox profile folder   Delete the favicon cache    For Chrome  remove Favicons and Favicons-journal For Firefox  remove favicons sqlite    This will almost definitely work  If not    Possibility 1  An update to your browser has changed how the favicon cache works  Please edit this answer with new instructions  Possibility 2  Your favicon problem has nothing to do with overaggressive caching  It may instead  be a resource-loading problem     using Developer Tools  make sure the new favicon is downloading properly

User · Answer

If you are just interested in debugging it to make sure it has changed  you can just add a dummy entry to your  etc hosts file and hit the new URL   That favicon wouldnt be cached already and you can make sure you new one is working   Short of changing the name of the favicon  there is no way you can force your users to get a new copy

User · Answer

For Internet Explorer  there is another solution    Open internet explorer  Click menu   tools   internet options  Click general   temporary internet files    settings  button  Click  view files  button  Find your old favicon ico file and delete it  Restart browser internet explorer

User · Answer

If the problem continues despite of applying some steps above try to restart the IIS Server  Hope this helps

User · Answer

This is a workaround for the chrome bug  change the rel attribute to stylesheet  Keep the original link though  Works like a charm      I came up with this workaround because we also have a requirement to be able to  update customer s sites   production code and I didn t find any of the other solutions to work

User · Answer

To refresh your site s favicon you can force browsers to download a new version using the link tag and a querystring on your filename  This is especially helpful in production environments to make sure your users get the update       lt link rel  icon  href  http   www yoursite com favicon ico v 2    gt

User · Answer

It may be useful to just a few people  but I had the same problem and discovered that it was related to file permessions  so I gave it a 777 permission and it worked  of course after you re sure the problem it s there  make sure to change back the permissions to safer values

User · Answer

Chrome Version  68 0 3440 106  Just restart Chrome  in your address bar   chrome   restart

User · Answer

Well  overhead is overhead  but yes  not too big   Also  browsers are sometimes  greedy  about cached files  You could clear cache and or restart your browser and may see the change  If that fails though     My cheapo solution is to    Visit your file at http   example com favicon ico in your browser  Delete the favicon ico from your webroot  Visit http   example com favicon ico again in a browser  verify it s missing  Upload new one to your webroot  Visit http   example com favicon ico again in a browser  verify it s the new one    If that sequence doesn t work  then something else is going on

User · Answer

Here s how I managed it with a simply animated favicon and FireFox 3 6 13  beta version  It will probably work for other versions of FireFox as well  let me know if it doesn t  It s basically artlung s solution  but addressing the  gif file as well    I opened by FTP program  downloaded my favicon ico AND favicon gif files   then DELETED them from my server s files  Then I opened them in my browser as artlung suggested  http   mysite com favicon ico AND http   mysite com favicon gif Once those addresses loaded and displayed 404 error pages   page not found   I THEN uploaded both files back onto my server  and PRESTO - the correct icons were instantly displayed

User · Answer

If you use PHP you could also use the MD5-Hash of the favicon as a query-string    lt link rel  shortcut icon  href  favicon ico v  lt  php echo md5 file  favicon ico     gt     gt    This way the Favicon will always refresh when it has been changed   As pointed out in the comments you can also use the last modified date instead of the MD5-Hash to achieve the same thing and save a bit on server performance    lt link rel  shortcut icon  href  favicon ico v  lt  php echo filemtime  favicon ico     gt     gt

User · Answer

This works for Chrome    on Mac  delete file    user home  Library Application Support Google Chrome Default Favicons on Windows  delete files  C  Users username  AppData Local Google Chrome User Data Default Favicons C  Users username  AppData Local Google Chrome User Data Default Favicons-journal   source

User · Answer

Simon  I suppose there s a reason none of the other answers is accepted so far  Thus I believe this could be a Grails issue nevertheless - Especially if you re using the  Resources Plugin    If your plugins provide a favicon  which - illogically - many do   they might override the one you desired to use - given yours is in a plugin itself   If deleting the favicon from all your plugins temporary resolves the issue then you re very likely experiencing this   http   jira grails org browse GPRESOURCES-134

User · Answer

Rename the favicon file and add an html header with the new name  such as    lt link rel  SHORTCUT ICON  href  http   www yoursite com favicon2 ico    gt

User · Answer

For Chrome on macOS  if you don t want to delete the entire Chrome favicon database as suggested already here  you can delete only the conflicting icons    Quit Chrome Load the favicons database  using sqlite here     sqlite3   Library Application  Support Google Chrome Default Favicons   Search for the file that is causing issues   select   from favicons where url    http   mysite dev favicon ico     If you are happy with the output    delete from favicons where url    http   mysite dev favicon ico      Alternatively  you can search for a pattern that you can reuse to delete multiple entries      Search for multiple files that are causing issues   select   from favicons where url like  http   mysite dev      And again if you are happy with what this returns    delete from favicons where url like  http   mysite dev        Type  exit and hit return to quit sqlite Restart Chrome

User · Answer

Ok  after 10 minutes of trying  the easy way to fix it is close to that of the line of birds   Type in www yoursite com favicon ico  or www yoursite com apple-touch-icon png  etc   Push enter ctrl f5 Restart Browser  IE  Firefox

User · Answer

In Chrome on Mac OS X one can remove file with favicon cache     user home  Library Application Support Google Chrome Default Favicons

User · Answer

I recently restored my bookmarks and was looking for a way to restore the FavIcons without visiting each page   My search brought me to this thread    For those in a similar circumstance merely download the FAVICON RELOADER addon   Once installed you will find the  reload favorite icons  command in your BOOKMARKS dropdown menu   https   addons mozilla org en-US firefox addon faviconreloader  src api

[favicon] How do I force a favicon refresh?

Examples related to favicon