如何强制使用favicon刷新？

Question

如何强制使用favicon刷新？

我有一个使用自己的tomcat在本地运行的Grails应用程序,我刚刚更改了一个新的favicon.问题是我无法在任何浏览器中看到它.旧的favicon出现了,或者我根本没有获得图标,但不是我的新图标.我不认为这本身就是Grails问题,更多的是关于favicons的问题.

favicons应该发生什么？它们应该如何工作？我的浏览器中有很多书签,它们有错误的图标,似乎永远不会刷新.如何强制服务器/浏览器停止缓存它们？总是缓存它们似乎很愚蠢,因为它们通常只有16x16.为什么不在每次访问页面时上传它们？这不是一个巨大的开销.

Answer 1

Mar*_*ark 2047

要刷新站点的favicon,您可以强制浏览器使用链接标记和文件名上的查询字符串下载新版本.这在生产环境中尤其有用,可确保您的用户获得更新.

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

Run Code Online (Sandbox Code Playgroud)

这对我有用.我不得不从我的代码中删除`type ="image/x-icon"`,与许多来源相反.我使用文件修改时间戳作为查询的`v？= 2`部分. (35认同)
缓存favicons是有意义的,因为它们有时会推送2-3千字节的大小.您不希望继续传输所有数据.(是的,讽刺) (24认同)
我发现在某些浏览器中,除非我删除了历史记录,否则favicon不会做任何事情.然后它将保存新的图标. (9认同)
不幸的是,您需要IE7(&IE8？)的完全限定绝对URL - 请参阅http://jeffcode.blogspot.com.au/2007/12/why-doesnt-favicon-for-my-site-appear.html (6认同)
同意上述评论,但这适用于所有当前浏览器:<link rel ="快捷图标"href ="/ favicon.ico？v = 2"/> (4认同)
+1这只是疯狂,半小时浪费时间,你认为在验证应用程序路径时,后端首先出现问题,你刷新浏览器缓存就像疯了一样.然后像这样的解决方案工作.为什么浏览器会被缓存以缓存甚至缓存清除无效的东西......(修辞) (3认同)
@Raj是的.此技术可用于引用文件的任何位置:css文件,js文件,img标签,css背景图像等. (2认同)
或者只是`[...].ico？2` - 这就足够了.我还将此数字存储为某个常量,并将其应用于所有不同类型的资源.例如`CssVersion`,`JsVersion`等. (2认同)
这对于清除访问生产服务器站点的浏览器的缓存是一种有用的技术，但是出于本地开发的目的，这也有助于了解可以访问example.com/favicon.ico并按`Ctrl + Shift + R`几次。:-) http://stackoverflow.com/questions/2208933/how-do-i-force-a-favicon-refresh#comment62580011_2208982 (2认同)

Answer 2

小智 811

好吧,经过10分钟的wtf'ing,解决它的简单方法接近于lineofbirds

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

使用此方法您可能会克服缓存,但您的现有用户不能.因此,我发现另一个答案更有价值. (6认同)
值得注意的是,这在Firefox 33中不起作用.第一个答案是更好的选择. (3认同)
"重启浏览器"部分是唯一真正让它适用于我的东西.所有其他修复在理论上都有效,但实际上并未更改浏览器选项卡上显示的favicon像素.+1这个答案 (3认同)

Answer 3

Gar*_*ley 261

这个答案还没有给出,所以我想我会发布它.我环顾网络,并没有找到一个在本地开发中测试favicons的好答案.

在当前版本的chrome(在OSX上),如果您执行以下操作,您将立即获得favicon刷新:

将鼠标悬停在标签上
右键点击
选择重新加载
您的favicon现在应该刷新

这是我发现在本地更新favicon的最简单方法.

也不适用于我 - 操作系统X上的Chrome (10认同)
适用于OS X Sierra和Chrome 53.0.2785.143(64位) (3认同)
适用于OSX上的Chrome 67.0.奇怪的是它不适用于`CMD` +`Shift` +`R` (3认同)

Answer 4

Kla*_*sen 56

重命名favicon文件并添加带有新名称的html标头,例如:

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

Run Code Online (Sandbox Code Playgroud)

我认为浏览器可以看到favicon名称是否相同.如果是,它将不会再次请求下载并将使用已经缓存的,但如果您更改名称,它将假定它已更改,从而从服务器请求它. (4认同)
这是做什么的？ (2认同)
这根本不令人耳目一新,它完全改变了它. (2认同)

Answer 5

Fel*_*erg 53

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

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

Run Code Online (Sandbox Code Playgroud)

这样,Favicon在更改后将始终刷新.

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

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

Run Code Online (Sandbox Code Playgroud)

这个答案的问题是你在每个请求上计算这个哈希值,这是不必要的,可能会损害站点性能(如果有很多用户). (41认同)
我仍然没有看到计算MD5的任何真正原因.使用文件的上次修改日期更容易,也更有效.我认为在最后修改的邮票上使用MD5没有任何优势. (12认同)
您多久更新一次你的图标？这看起来有点矫枉过正.只需在创建新图标时使用手动查询字符串即可. (8认同)
很好,这避免了每次更新图标时都需要更改href,这个答案应该有更多的选票! (2认同)

Answer 6

kon*_*nzo 50

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

关闭浏览器.确保不再运行浏览器进程(例如,检查任务管理器chrome.exe或firefox.exe).
导航到浏览器存储用户文件的位置:
- 对于Chrome,请转到Chrome数据目录.
- 对于Firefox,请转到Firefox配置文件文件夹.
删除favicon缓存.
- 对于Chrome,请删除Favicons和Favicons-journal
- 对于Firefox,请删除 favicons.sqlite

这几乎肯定会奏效.如果不:

可能性1:浏览器更新改变了favicon缓存的工作方式.请使用新说明编辑此答案.
可能性2:您的favicon问题与过度缓存无关.它可能是一个资源加载问题 - 使用开发人员工具,确保新的favicon正确下载.

Chrome中更简单的解决方案是右键单击并选择Inspect(或CTRL + SHIFT + I),然后单击并按住刷新按钮.将出现一个菜单,其中包含"刷新","硬重新加载"或"清空缓存"和"硬重新加载"选项.通常Hard Reload会这样做,但如果由于某种原因它很顽固,那么Empty Cache和Hard Reload肯定会. (3认同)
这是一个很好的答案,满足我的测试需求.这个问题没有一个真正的答案,因为它取决于谁需要更新它以及他们愿意和能够合理地做些什么. (2认同)
只是一点点改进：任何用户名的相同路径是`%appData%/../Local/Google/Chrome/User Data/Default` (2认同)

Answer 7

Max*_*zin 29

在Mac OS X上的Chrome中,可以使用favicon缓存删除文件

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

Run Code Online (Sandbox Code Playgroud)

这种方法在Windows上也适用于我,我从我的应用程序中删除了favicon,但Chrome仍然显示它.关闭Chrome,删除"C:\ Users\{user}\AppData\Local\Google\Chrome\User Data\Default\Favicons",然后重新启动Chome.旧的不受欢迎的图标消失了. (2认同)
我在"默认"下没有任何内容,但最终我发现了这种变化:`$ {user.home}/Library/Application Support/Google/Chrome/Profile 1/Favicons` (2认同)

Answer 8

art*_*ung 17

好吧,开销是开销,但是,不是太大.

此外,浏览器有时对缓存文件"贪婪".您可以清除缓存和/或重新启动浏览器,并可能会看到更改.如果那失败了......

我的廉价解决方案是:

在浏览器中访问http://example.com/favicon.ico上的文件.
从您的webroot中删除favicon.ico.
在浏览器中再次访问http://example.com/favicon.ico,验证它是否丢失.
将新的上传到您的webroot.
在浏览器中再次访问http://example.com/favicon.ico,确认它是新的.

如果该序列不起作用,则会发生其他事情.

这对我有用,但遗憾的是我们不能要求每个访客都这样做. (7认同)
访问http://example.com/favicon.ico并按Ctrl + F5/Ctrl + Shift + R多次为我工作:)感谢您的想法! (3认同)

Answer 9

Mit*_*ers 15

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

Answer 10

小智 12

ON MAC: ⌘+ Shift- R或按住Ctrl并单击浏览器中的重新加载按钮.

这不会强制重新加载收藏夹图标。 (2认同)

Answer 11

nam*_*nam 10

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

打开Internet Explorer.
单击菜单>工具> Internet选项.
单击常规>临时Internet文件>"设置"按钮.
单击"查看文件"按钮.
找到您的旧favicon.ico文件并将其删除.
重新启动浏览器(Internet Explorer).

Answer 12

Sen*_*lez 9

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

我不相信您的收藏夹会在您重新访问该页面之前刷新您的收藏夹,并假设您之前已清除了浏览器缓存.

您的网络浏览器不会通过互联网自行检查新的图标...谢天谢地.

@Simon,缓存很傻？!？我希望您的客户知道自2010年以来您已经了解了更好的Web开发的重要性.什么是"愚蠢"不是缓存并向您的服务器发出不必要的请求,因为这些请求很少(如果有的话)发生变化. (6认同)
http://developer.yahoo.com/performance/rules.html提到了与您可能没有想到的下载favicon.ico相关的问题.周围有很好的提示.缓存是一种有价值的工具,可确保您的网站尽可能快地运行.缓存对于让您的浏览器尽可能快地感觉很有用. (5认同)
"你的网络浏览器不会通过互联网来检查它自己的新图标......谢天谢地." 为什么不？为什么不刷新页面加载的时间？这是一个2k的图像,这是花生.它永远不会过时.整个缓存的想法在宏伟的计划中是愚蠢的. (3认同)

Answer 13

Old*_*her 8

尝试在新标签页中打开

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

但这最终适用于Chrome(25.0.x)和Safari(6.0.1):

刷新缓存
将favicon与<link>标签硬连接
导航到 mysite.com/favicon.ico
mysite.com在新标签页中打开

(直到第3步,在相同的选项卡中刷新,不断重现旧图标.)

Answer 14

MrU*_*own 8

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

退出Chrome
加载favicon数据库(在这里使用sqlite):

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

搜索导致问题的文件

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

如果您对输出感到满意:

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

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

搜索导致问题的多个文件

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

如果您对此返回的内容感到满意,请再次:

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

输入.exit并点击返回退出sqlite
重启Chrome

Answer 15

Low*_*der 7

铬版本：68.0.3440.106

只需重新启动 Chrome（在您的地址栏中）： chrome://restart

Answer 16

Dea*_*n J 6

当您从Google请求favicon时,您可以查看响应标头.

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

Run Code Online (Sandbox Code Playgroud)

如果您在响应中放置"Expires:"标头,则客户端浏览器将在该时间戳之后重新请求该图标.在进行活动开发时,您可以将expires时间戳设置为将来的一两秒,并始终让它获取此值,尽管这是一个糟糕的长期计划.

它也只是先发制人,这超出了问题的目的. (2认同)

Answer 17

Stu*_*ley 5

Chrome的favicon支持是错误的 - 忽略了这个答案

我写这个答案的印象是,这是在Chrome Chrome中刷新favicon所花费的.然而,事实证明这只适用于前五分钟左右,直到Chrome的历史同步中的图标无法挽回.

原始答案

您不必清除缓存,重新启动浏览器或重写HTML - 只需更改图标的URL 一次,这样浏览器就会忘记以前缓存的图标.

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

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

Run Code Online (Sandbox Code Playgroud)

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

归档时间：	15 年，8 月前
查看次数：	654074 次
最近记录：	6 年，6 月前