如何强制网站图标刷新?


1535

我有一个Grails应用程序,它使用自己的tomcat在本地运行,而我刚刚将图标图标更改为一个新图标。问题是我无法在任何浏览器中看到它。出现旧的收藏夹图标,或者我什么都没有得到,但是我的新收藏夹没有。我认为这本身不是Grails的问题,更多的是网站图标的问题。

网站图标应该发生什么?他们应该如何工作?我的浏览器中有很多书签,这些书签的图标错误,它们似乎从未刷新过。如何强制服务器/浏览器停止缓存它们?鉴于通常只有16x16,总是缓存它们似乎很愚蠢。为什么不随页面访问一起上传它们呢?这并不是一个巨大的开销。


12
公认且高度评价的解决方案不是真正的解决方案。刷新不起作用的实际原因可以在以下问题的解决方案中找到:stackoverflow.com/questions/8616016/…-图标缓存位于sqlite DB文件中,与浏览器缓存无关!
Mörre

8
公认且高度评价的解决方案是生产解决方案,或者当我们更新生产图标集时,我应该为用户编写教程如何清除其图标集缓存吗?
米罗斯拉夫·萨拉斯维奇

2
不是一般的解决方案。如果您使用favicon默认位置而不触摸代码怎么办?也就是说,favicon.ico文档根目录中的文件。
塞巴斯蒂安

Answers:


2088

要刷新您网站的收藏夹图标,您可以强制浏览器使用链接标签和文件名上的查询字符串下载新版本。这在生产环境中特别有用,可确保您的用户获得更新。

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

35
这帮了我大忙。type="image/x-icon"与许多资料相反,我不得不从代码中删除。我v?=2在查询部分使用了文件修改的时间戳。
Wertisdk 2012年

10
我发现在某些浏览器中,除非删除历史记录,否则网站图标不会进行tupdate。然后它将保存新的图标。
探路者

6
不幸的是,你需要为IE7完全合格的绝对URL(IE8) -见jeffcode.blogspot.com.au/2007/12/...
EUG

5
同意上述意见,但这对我当前所有的浏览器都适用:<link rel =“ shortcut icon” href =“ / favicon.ico?v = 2” />
Dave Sumter 2013年

31
缓存网站图标很有意义,因为它们有时会推送2-3 KB。您不想继续传输所有数据。(是的,讽刺)
Flat Cat

823

好了,经过10分钟的尝试,简单的修复方法接近鸟类

  1. 输入www.yoursite.com/favicon.ico(或www.yoursite.com/apple-touch-icon.png等)
  2. enter
  3. ctrl+f5
  4. 重新启动浏览器(IE,Firefox)

8
使用此方法,您可能会克服缓存,但是现有用户无法。因此,我发现其他答案更有价值。
Demircan Celebi 2014年

3
值得注意的是,这在Firefox 33中不起作用。第一个答案是一个更好的选择。
布伦特·瓦格纳2014年

1
我必须关闭开发工具才能在Chrome中运行该工具。
tehwalris,2015年

1
我不必重新启动浏览器,但必须在没有打开devtools的情况下在选项卡中导航到我的网站。出于某种原因,可以在非devtools选项卡中按Ctrl + F5。我可以按Ctrl + F5组合键,然后在devtools选项卡中尽可能多地浏览整个Internet并返回我的站点,并且它永远不会更新收藏夹图标。
mjohnsonengr 16'Mar

3
“重新启动浏览器”部分是使它真正为我工作的唯一东西。所有其他修复程序在理论上都有效,但实际上不更改浏览器选项卡上显示的图标图标。+1这个答案
b264

262

这个答案还没有给出,所以我认为应该发表。我在网上浏览了所有内容,但没有找到在本地开发中测试网站图标的好答案。

在当前版本的chrome(在OSX上)中,如果执行以下操作,则会立即刷新网站图标:

  1. 将鼠标悬停在标签上
  2. 右键点击
  3. 选择重新加载
  4. 您的收藏夹图标现在应该刷新了

这是我发现的在本地刷新图标的最简单方法。


1
不幸的是,这在IE甚至Windows上的Chrome中都无法使用,因此除非您仅在OSX上使用Chrome,否则您似乎应该接受公认的答案。
克里斯托弗·金

3
可以在OS X Sierra中使用Chrome 53.0.2785.143(64位)
Seno,

1
工作对我来说:铬58.0.3029.110时,Windows 10,本地主机
[R布里尔

1
适用于Windows 10的Chrome 63.0.3239.84!
beawolf

4
在OSX的Chrome 67.0中可以使用。奇怪的是,它无法与CMD+ Shift+ 一起使用R
cephei_vv

56

重命名收藏夹文件,并添加具有新名称的html标头,例如:

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

4
我假设浏览器可以看到favicon名称是否相同。如果是,它将不再请求下载,而将使用已缓存的,但是如果您更改名称,它将假定它已更改,因此从服务器请求它。
2011年

我遇到了IE8的问题。它没有使用放在子文件夹中的favicon.ico。添加rel属性的“快捷方式”可以解决此问题。
tienbuiDE 2013年

3
那根本就没有刷新,而是将其完全更改为新的。
扎克

请注意,您还必须重命名实际的favicon.ico(它将位于您的构建文件夹或提供
Web

55

如果您使用PHP,还可以将favicon的MD5-Hash用作查询字符串:

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

这样,当Favicon更改时,它将始终刷新。

如评论中所指出的,您还可以使用上次修改日期而不是MD5-Hash来实现相同目的并节省服务器性能:

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

2
很好,这避免了每次我更新网站图标时都需要更改href的问题,此答案应获得更多投票!
Sven van den Boogaart,2014年

44
这个答案的问题是,您正在计算每个请求的哈希,这是不必要的,并且可能会损害站点性能(如果有大量用户)。
Diego Jancic'1

1
从两个方面来说,这并没有什么大不了的……一个favicon只是几千字节……我的意思是,服务器上的压力不会比每次都要管理该favicon都要少……
Philippe Gilbert

14
我仍然没有任何真正的理由来计算MD5。使用文件的上次修改日期更加简单有效。与上次修改的图章相比,使用MD5没有优势。
NickG

9
您真正多久更新一次图标?这似乎太过分了。制作新图标时,只需使用手动查询字符串。
零和一

51

通过销毁浏览器用于存储旧图标的文件,您可以强制加载新的图标。

  1. 关闭浏览器。确保不再运行浏览器进程(例如,检查“任务管理器”为chrome.exefirefox.exe)。
  2. 导航到浏览器存储用户文件的位置:
  3. 删除收藏夹缓存。
    • 对于Chrome,请删除FaviconsFavicons-journal
    • 对于Firefox,删除 favicons.sqlite

这几乎肯定会起作用。如果不:

  • 可能性1:浏览器的更新已更改了网站图标缓存的工作方式。请使用新的说明编辑此答案。
  • 可能性2:您的网站图标问题与过度激进的缓存无关。相反,它可能是资源加载问题–使用开发人员工具,确保正确下载了新的图标。

这成功了。对我而言,这是Google Chrome应用程序图标问题。不是DOM网站图标问题。
klewis's

2
这是一个很好的答案,可以满足我的测试需求。这个问题没有一个真正的答案,因为它取决于谁需要刷新它,以及他们愿意并且有能力合理地做什么。
Dovev Hefetz

1
只是有一点改进:任何用户名的相同路径是%appData%/../Local/Google/Chrome/User Data/Default
josemmo

3
在Chrome中,一个更简单的解决方案是右键单击并选择检查(或CTRL + SHIFT + I),然后单击并按住刷新按钮。将出现一个菜单,其中包含“刷新”,“硬重载”或“清空缓存和硬重载”选项。通常,硬重装可以做到这一点,但是如果由于某种原因而固执,则肯定可以使用空缓存和硬重装。
felwithe

1
在Linux上,您可以在以下位置找到这些文件:~/.config/google-chrome/Default
Arnold Schrijver,

29

在Mac OS X上的Chrome中,可以使用网站图标缓存删除文件

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

1
这个解决方案对我有用。由于某种原因,它并没有以更多的票数使用上述方法刷新网站图标。谢谢马克西姆·马津(Maxim Mazin)。我只想摆脱一个旧的收藏夹图标,我知道它在我的新主机上已经不存在了。
tsaulic 2014年

2
这种方法在Windows上也对我有用,在Windows中我已从应用程序中删除了图标图标,但chrome仍在显示它。关闭Chrome,删除“ C:\ Users \ {user} \ AppData \ Local \ Google \ Chrome \ User Data \ Default \ Favicons”,然后重新启动Chome。旧的不需要的图标消失了。
skomisa 2015年

2
在“默认”下我什么都没有,但最终我发现了这种变化:${user.home}/Library/Application Support/Google/Chrome/Profile 1/Favicons
mdahlman

@mdahlman在尝试了所有其他方法之后,这最初对我不起作用。但是,我在cmd+q启用chrome后进入菜单栏,再次强制退出chrome并等待2分钟以打开浏览器并导航回到我的网站,然后开始使用该工具。
PrimeTimeTran

17

好吧,开销就是开销,但是是的,不要太大。

同样,浏览器有时对缓存的文件“贪婪”。您可以清除缓存和/或重新启动浏览器,然后可能会看到更改。如果失败了...

我的cheapo解决方案是:

  1. 在浏览器中通过http://example.com/favicon.ico访问您的文件。
  2. 从您的webroot删除favicon.ico。
  3. 在浏览器中再次访问http://example.com/favicon.ico,确认其丢失。
  4. 将新的上传到您的webroot。
  5. 在浏览器中再次访问http://example.com/favicon.ico,确认它是新的。

如果该顺序不起作用,则说明正在进行其他操作。


7
这对我有用,但可惜我们不能要求每个访客都这样做。
天才的

3
访问example.com/favicon.ico,然后按Ctrl + F5 / Ctrl + Shift + R几次对我有用:)感谢您的创意!
西川阿方索

17

根据浏览器的不同,它们的处理方式也不同,但通常我会发现它会转到网站的默认页面并进行硬刷新。 CTRL+ F5,通常会使其更新。


Mac用户:CMD SHIFT 5
Gianfranco Fertino

13

在MAC上: + Shift- R或按住Ctrl并单击浏览器中的重新加载按钮。


2
这不会强制重新加载收藏夹图标。
洗发水

1
这确实重新加载了我的网站图标/解决了问题
rgareth

适用于ubuntu 16.04
uneet7 '19

10

对于Internet Explorer,还有另一种解决方案:

  1. 打开Internet Explorer。
  2. 点击菜单>工具>互联网选项。
  3. 单击常规> Internet临时文件>“设置”按钮。
  4. 点击“查看文件”按钮。
  5. 找到旧的favicon.ico文件并删除它。
  6. 重新启动浏览器(Internet Explorer)。

9

很有可能是网络浏览器问题。您将必须从浏览器中删除缓存,然后关闭浏览器并重新打开。那应该解决它。

我不相信您的收藏夹图标会在您重新访问该页面之前,并且假设您以前已清除浏览器缓存后,会在您的收藏夹中得到刷新。

您的网络浏览器将不会自行访问互联网以查找新的收藏夹图标……谢天谢地。


3
“您的网络浏览器将不会自行上网检查新的网站图标……谢天谢地。” 为什么不?为什么不在加载页面的前一天刷新呢?这是2k图像,是花生。它永远不会过时。整个缓存想法在事物的宏伟计划中只是愚蠢的。
西蒙

5
developer.yahoo.com/performance/rules.html提到了您可能没有想到的与下载favicon.ico有关的问题。到处都是好提示。缓存是确保您的网站以实际速度运行的宝贵工具。缓存对于使浏览器尽可能快地运行也很有用。
artlung 2010年

6
@Simon,缓存很傻吗?!?我希望为您的客户着想,自2010年以来您已经了解了更好的Web开发的重要性。“傻”的意思是不缓存并向服务器发出不必要的请求,而这些请求相当于一个静态文件,很少更改(如果有的话)。
Ed DeGagne 2013年

8

尝试在新标签页中打开

我尝试了上面的许多操作(重置缓存,刷新,使用链接标签等),甚至检查了.htaccess文件并重置ExpiresByType变量。

但这是最终在Chrome(25.0.x)和Safari(6.0.1)中对我有用的东西:

  1. 刷新缓存
  2. 将收藏夹图标与<link>标签硬链接
  3. 导航到 mysite.com/favicon.ico
  4. mysite.com在新标签页中打开

(直到第3步,在同一选项卡中刷新仍会重现旧图标。)


8

对于macOS上的Chrome,如果您不想按照此处已经建议的那样删除整个Chrome网站图标数据库,则只能删除有冲突的图标:

  1. 退出Chrome
  2. 加载收藏夹数据库(在此处使用sqlite):

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

  1. 搜索引起问题的文件

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

  1. 如果您对输出满意:

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


或者,您可以搜索可重复使用的模式以删除多个条目:


  1. 搜索导致问题的多个文件

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

  1. 再一次,如果您对返回的结果感到满意:

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


  1. 输入.exit并按回车键即可退出sqlite
  2. 重新启动Chrome

6

当您向Google请求收藏图标时,您可以查看响应标题。

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

如果在响应上放置“ Expires:”标头,则客户端浏览器将在该时间戳记之后重新请求图标。在进行主动开发时,您可以将过期时间戳记设置为将来的一两秒,并且始终可以获取该时间戳记,尽管这是一个糟糕的长期计划。


2
它也只能先发制人地工作,这超出了问题的目的。
ANeves 2012年

6

Chrome版本:68.0.3440.106

只需重启Chrome(在地址栏中): chrome://restart


5

Chrome的网站图标支持存在问题-忽略此答案

我写这个答案的印象是,这就是在Google Chrome浏览器中刷新图标的过程。但是,事实证明,这仅在前五分钟左右有效,直到该图标在Chrome的历史记录同步中不可挽回地丢失

原始答案

您无需清除缓存,重新启动浏览器重写HTML -您只需更改一次图标的URL 即可,这样浏览器便会忘记以前缓存的图标。

假设您已通过<link>页面中的元素定义了图标<head>,则可以通过在控制台中运行以下标准JS单行代码来实现:

[].slice.call(document.querySelectorAll('head>link[rel$="icon"]')).map(function(ln){ln.href+='?v=2'});

有关可以自动为生产中的最终用户执行此操作的更高级实现,请参见freshicon.js


如果您要摆脱不受控制的服务器上的缓存图标(该图标现在丢失/返回了非200的http代码),这实际上很有用。而不是将?v=2整个URL替换为您选择的图标,而是刷新后似乎仍然存在
Paul S.17年

4

我最近恢复了书签,并且一直在寻找一种无需访问每个页面即可恢复收藏夹图标的方法。我的搜索将我带到了这个话题。

对于处于类似情况的用户,只需下载FAVICON RELOADER插件。安装完成后,您将在BOOKMARKS下拉菜单中找到“重新加载收藏的图标”命令。

https://addons.mozilla.org/zh-CN/firefox/addon/faviconreloader/?src=api


它回到那里进行安装,看起来确实很有希望(您可以在书签菜单中找到AddOn),但是它也没有在不重新启动的情况下重新加载我的firefox 34(在Linux上)上的图标
rubo77 2014年

4

如果您使用的是PHP ..那么您也可以使用此行。

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

它将在每次加载页面时刷新您的网站图标。


2
这就是问题“它将在每次加载页面时刷新您的网站图标”。缓存如何?网站图标应被缓存。
machineaddict 2014年

如果您想缓存新的图标,则只需提供任何新值即可。<link rel =“ shortcut icon” href =“ yoursite.com/favicon.ico?v=12345 ”>
Shakeel Ahmed

2
favicon.ico?v = <?php echo md5_file('favicon.ico'),由Felix Wienberg @machineaddict建议
Sven van den Boogaart 2014年

1
这不是解决此问题的好方法。使用time()将强制它每次都重新加载图标。您希望favicon.ico 文件的最后修改时间不是当前的挂钟时间。
NickG

如果您舍入到最近的24小时或最近的30天怎么办?每月重置缓存可能很有用
SwiftNinjaPro

3

如果您只想调试它以确保已更改,则可以在/ etc / hosts文件中添加一个虚拟条目,然后单击新URL。该图标将不会被缓存,您可以确保新的图标正在运行。

除非更改图标的名称,否则无法强迫用户获取新副本。


2

适用于Chrome:

  • 在Mac上:删除文件

    $ {user.home} /库/应用程序支持/ Google / Chrome / Default / Favicons

  • 在Windows上:删除文件

    C:\ Users [用户名] \ AppData \ Local \ Google \ Chrome \ User Data \ Default \ Favicons C:\ Users [用户名] \ AppData \ Local \ Google \ Chrome \ User Data \ Default \ Favicons-journal

资源


1

这是解决Chrome错误的方法:将rel属性更改为样式表!保留原始链接。奇迹般有效:

我想出了这种解决方法,因为我们还需要能够更新客户的站点/生产代码,而我找不到其他解决方案。


1
我在这里尝试了所有建议(编码)解决方案,这是唯一对我有用的解决方案。你知道为什么吗?
Crystal Miller

1

我知道这是一个非常老的问题,但它仍然是一个相关的问题,尽管这些天仅适用于mozilla。(我不知道是什么资源管理器执行的,因为我们不为非标准浏览器编写代码)。

如果标头中包含图标标签,则Chrome的行为良好。

尽管mozilla很清楚这个问题,但像往常一样,它们从未修复过烦人的小东西。甚至6年后。

因此,有两种方法可以用firefox强制刷新图标。

  1. 让您的所有客户端卸载Firefox。然后重新安装。

  2. 手动在网址栏中输入域名-不要仅在域名(mydomain.com)中使用http或www。

当然,这假定您的ns记录仅包含域名解析。


1

简单,

1:我不想摆弄代码(ps我的网站构建器不使用代码,它使用“上传文件”按钮,它本身就可以使用)

2:我尝试了CTRL+ F5,但对我来说无效。

我有一个解决方案:

IE:转到设置齿轮O清除所有浏览器历史记录和cookie

Chrome:转到X右下角看起来像=的菜单,然后转到设置,历史记录,清除浏览数据,然后选中所有适用的框(我做了历史记录,Cookie,并从时间的开始)


4
这个问题与网站图标如何被缓存有关。清除本地缓存将为您解决此问题,但不会为其他任何人解决。
马克·乔利

@MarkChorley正是原始问题所在。在本地开发环境中缓存网站图标。
MrUpsidown '17


0

这是我使用简单的动画图标和FireFox 3.6.13(测试版)对其进行管理的方式。它可能也适用于其他版本的FireFox,请告知它是否无效。这基本上是artlung的解决方案,但也可以处理.gif文件:

  1. 我通过FTP程序打开,下载了我的favicon.ico和favicon.gif文件,
  2. 然后从我的服务器文件中删除它们。
  3. 然后按照artlung的建议在浏览器中打开它们:http : //mysite.com/favicon.ico 和http://mysite.com/favicon.gif一旦这些地址加载并显示404错误页面(“找不到页面”)
  4. 然后,我将两个文件上传回我的服务器和PRESTO-正确的图标立即显示出来。

1
哦-顺便说一句,要显示新的书签,我还必须删除保存的书签-同样的过程也适用于Google Chrome。
lineofbirds 2011年

0

另外,请确保您输入完整的图像URL,而不仅仅是其相对路径:

http://www.example.com/images/favicon.ico

并不是:

images/favicon.ico

3
/images/favicon.ico是执行此操作的正确方法:它“适用于”不同的环境(开发/测试/生产),并且是从文档基本URL开始的绝对路径。
ANeves 2012年

不幸的是,您需要IE7(&IE8?)的标准
URL-

2
这不是真正的答案,这是一条评论。
扎克

0

如果尽管采取了上述某些步骤后问题仍然存在,请尝试重新启动IIS服务器。希望这可以帮助...


-3

西蒙,我想到目前为止,没有其他答案被接受是有原因的。因此,我认为这仍然可能是Grails的问题-特别是如果您使用的是“资源插件”。

如果您的插件提供了一个收藏夹图标(从逻辑上讲,很多图标都这样做),则它们可能会覆盖您想要使用的图标,因为您的图标在插件本身中。

如果从您的所有插件中临时删除图标,则可以解决此问题,那么您很可能会遇到这种情况:

http://jira.grails.org/browse/GPRESOURCES-134


-3

请按照以下步骤更改应用程序图标:

  1. 在项目中添加.ico文件。
  2. 转到angular.json并在其中的“项目”->“建筑师”->“构建”->“选项”->“资产”中,为您的图标文件输入一个条目。请参阅favicon.ico的现有条目以了解操作方法。
  3. 转到index.html并更新图标文件的路径。例如,

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

或者,使用favicon.ico重命名您的图标文件,并将其替换在目录中。

  1. 重新启动服务器。
  2. 硬刷新浏览器,一切顺利。
By using our site, you acknowledge that you have read and understand our Cookie Policy and Privacy Policy.
Licensed under cc by-sa 3.0 with attribution required.