ファビコンのリフレッシュを強制するにはどうすればよいですか？

StackOverflow https://stackoverflow.com/questions/2208933

  •  18-09-2019
  •  | 
  •  

質問

私は独自のTomcatを使用してローカルで実行されているGrailsアプリケーションを持っています、そして、私はちょうど新しいもののためにFaviconを変更しました。問題は、ブラウザでは表示できないことです。古いファビコンが現れるか、私はファビコンをまったく取得しませんが、私の新しいものではありません。これはそれ自体聖杯の問題であり、ファビコンの問題だとは思わない。

ファビコンで何が起こるはずですか？彼らはどのように働くことになっていますか？ブラウザには、間違ったアイコンがあり、リフレッシュされないように見える多くのブックマークがあります。サーバー/ブラウザにキャッシュを停止するように強制するにはどうすればよいですか？通常は16x16だけであることを考えると、常にキャッシュするのはかなり愚かなようです。ページに訪れるたびにアップロードしてみませんか？それはまさに大きなオーバーヘッドではありません。

役に立ちましたか？

解決

サイトのFaviconを更新するには、リンクタグとファイル名のクエリストリングを使用して、ブラウザに新しいバージョンをダウンロードさせることができます。これは、ユーザーが更新を確実に入手できるようにするために、実稼働環境で特に役立ちます。 

<link rel="icon" href="http://www.yoursite.com/favicon.ico?v=2" />

他のヒント

OK、10分間のwtf'ingの後、それを修正する簡単な方法は、lineofbirdsのそれに近いものです

  1. www.yoursite.com/favicon.ico（またはwww.yoursite.com/apple-touch-icon.pngなどを入力してください。
  2. 押す 入力
  3. Ctrl+F5
  4. ブラウザを再起動する（つまり、Firefox）

この答えはまだ与えられていないので、私はそれを投稿すると思いました。私はウェブの周りを見て、地元の開発でファビコンをテストするための良い答えを見つけませんでした。

Chromeの現在のバージョン（OSX）では、次のことを行うと、インスタントファビコンの更新が得られます。

  1. タブ上にホバーします
  2. 右クリック
  3. リロード]を選択します
  4. あなたのファビコンは今やリフレッシュする必要があります

これは、私がファビコンをローカルでリフレッシュする最も簡単な方法です。

Rename the favicon file and add an html header with the new name, such as:

<link rel="SHORTCUT ICON" href="http://www.yoursite.com/favicon2.ico" />

If you use PHP you could also use the MD5-Hash of the favicon as a query-string:

<link rel="shortcut icon" href="favicon.ico?v=<?php echo md5_file('favicon.ico') ?>" />

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:

<link rel="shortcut icon" href="favicon.ico?v=<?php echo filemtime('favicon.ico') ?>" />

By destroying the file your browser uses to store old favicons, you can force new ones to be loaded.

  1. Close your browser. Make sure there are no longer browser processes running (e.g. check Task Manager for chrome.exe or firefox.exe).
  2. Navigate to where your browser stores user files:
  3. 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.

In Chrome on Mac OS X one can remove file with favicon cache 

${user.home}/Library/Application Support/Google/Chrome/Default/Favicons

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:

  1. Visit your file at http://example.com/favicon.ico in your browser.
  2. Delete the favicon.ico from your webroot.
  3. Visit http://example.com/favicon.ico again in a browser, verify it's missing.
  4. Upload new one to your webroot.
  5. 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.

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.

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

For Internet Explorer, there is another solution:

  1. Open internet explorer.
  2. Click menu > tools > internet options.
  3. Click general > temporary internet files > "settings" button.
  4. Click "view files" button.
  5. Find your old favicon.ico file and delete it.
  6. Restart browser(internet explorer).

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.

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):

  1. Flushing cache
  2. Hard-linking the favicon with the <link> tag
  3. Navigating to mysite.com/favicon.ico
  4. Opening mysite.com in a new tab

(Up until step 3, refreshing in the same tab kept reproducing the old icon.)

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:

  1. Quit Chrome
  2. Load the favicons database (using sqlite here):

sqlite3 ~/Library/Application\ Support/Google/Chrome/Default/Favicons

  1. Search for the file that is causing issues

select * from favicons where url = 'http://mysite.dev/favicon.ico';

  1. 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:

  1. Search for multiple files that are causing issues

select * from favicons where url like 'http://mysite.dev%';

  1. And again if you are happy with what this returns:

delete from favicons where url like 'http://mysite.dev%';

  1. Type .exit and hit return to quit sqlite
  2. Restart Chrome

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.

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 <link> elements in your page's <head>, you can do that by running this standard-JS one-liner in the console:

[].slice.call(document.querySelectorAll('head>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.

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

If you are using PHP .. then you can also use this line.

<link rel="shortcut icon" href="http://www.yoursite.com/favicon.ico?v=<?php echo time() ?>" />

It will refresh your favicon on each page load.

Chrome Version: 68.0.3440.106

Just restart Chrome (in your address bar): chrome://restart

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

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

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.

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.

  1. Have all your clients uninstall firefox. Then re-install.

  2. 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.

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:

  1. I opened by FTP program, downloaded my favicon.ico AND favicon.gif files,
  2. then DELETED them from my server's files.
  3. 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")
  4. I THEN uploaded both files back onto my server, and PRESTO - the correct icons were instantly displayed.

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

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

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)

Just change this filename='favicon1.ico'

Please follow below steps to change app icon:

  1. Add your .ico file in the project.
  2. 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.
  3. Go to index.html and update the path of the icon file. For example,

<link rel="icon" type="image/x-icon" href="abc.ico">

Alternatively, rename your icon file with favicon.ico and replace it in the directory.

  1. Restart the server.
  2. Hard refresh browser and you are good to go.

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

ライセンス： CC-BY-SA と 帰属
所属していません StackOverflow
scroll top