HTML favicon不会在Google Chrome上显示

Question

HTML favicon不会在Google Chrome上显示

Nic*_*ick 54 html favicon google-chrome hyperlink

我正在制作一个未发布的HTML页面.我想要做的其中一件事是在标题旁边添加一个favicon.我正在使用谷歌浏览器,我注意到其他网站在浏览器中的瓷砖旁边显示的图标,但我试图显示的图标不会显示.该站点位于我桌面上名为site的文件夹中.这是代码:

<!DOCTYPE html>
<html> 
    <head>
        <title></title>
        <link rel="shortcut icon" href="/favicon.ico" />
    </head>
    <body>
    </body>
</html>

Run Code Online (Sandbox Code Playgroud)

Answer 1

Chr*_*son 31

由于您/的href中有一个前导,因此您将引用一个位于根文件夹中的文件.如果您的页面位于计算机上的文件夹中,而不是从本地Web服务器提供,则前导/将告诉浏览器查看文件系统的根文件夹.因此浏览器希望文件处于C:/favicon.ico或类似,这可能不是您所期望的.

如果您具有与favicon.ico网页相同的文件夹,则可以删除前导斜杠,并且该图标应该是可见的.

<link rel="shortcut icon" href="favicon.ico" />

Run Code Online (Sandbox Code Playgroud)

更新:

作为调试选项,您可以尝试添加您知道可用的标记.我从StackOverflow源中借用了这个片段.尝试用此替换您的链接标记,看看您是否将SO徽标作为您的图标.

<link rel="shortcut icon" 
      href="http://cdn.sstatic.net/stackoverflow/img/favicon.ico">

Run Code Online (Sandbox Code Playgroud)

更新2:

似乎在Chromium上报告了一个错误,如果文件是在本地加载的,则不显示favicon,而不通过网络服务器提供.

@Nick如果您打开开发人员工具(按F12),请转到网络选项卡,然后重新加载您的页面.您现在将看到所有资源都已加载.如果你找到你的favicon.ico,它在状态列中说了什么.你得到200分,404分还是什么？ (2认同)
@Nick查看我更新的答案,看看它是否适合您. (2认同)

Answer 2

Ric*_*ich 19

我发现(在Chrome 56,OSX),favicon状态似乎在浏览器生命周期中被缓存,因此如果没有加载favicon,则在重新启动Chrome之后才会加载.它似乎没有显示在开发工具的"应用程序"选项卡中,也不会被硬重新加载或"清除站点数据"清除.

我确认这个答案。唐·柯克比所说的是错误的。您确实必须退出浏览器并再次打开它。一旦浏览器收到网站图标请求的 404 错误，在浏览器重新启动之前，它不会向该域发送网站图标请求。隐身模式或开发人员工具 -> 应用程序 -> 清除存储 -> 清除站点数据将不起作用。 (2认同)

Answer 3

pok*_*bit 15

如果你的.htaccess例如读取,那么当期望的favicon不会出现的常见问题是缓存. ExpiresByType image/x-icon "access plus 1 month"

然后只需将一个随机值添加到您的favicon参考: <link rel="shortcut icon" href="https://example.com/favicon.ico?r=31241" type="image/x-icon" />

即使有大量缓存,每次都适用于我.

嘿。Chrome甚至没有尝试加载我的网站图标（开发控制台中没有404，没有网络请求）。然后我添加？v = 1并繁荣！做完了谢谢！ (2认同)

Answer 4

Der*_*ler 11

Chrome不显示图标的另一个原因是它仍然记得有问题的网站没有图标或者图标配置不正确的时间.

您将要完全擦除favicon缓存:

退出所有正在运行的Chrome进程
删除Favicons用户数据文件夹中的文件.例如:
```
C:\Users\me\AppData\Local\Google\Chrome\User Data\Default\Favicons
```
Run Code Online (Sandbox Code Playgroud)

清除浏览器缓存无法解决此问题,因为它不会影响Favicons容器.

另请注意,与您在线阅读的内容相反,对于favicon资源的请求不会显示在DevTools的"网络"面板中.在非常罕见的情况下,可能会出现一个这样的请求,但这种情况极不可能,并且DevTools无法帮助您解决您的电子邮件问题.

归档时间：	12 年，9 月前
查看次数：	91180 次
最近记录：	5 年，10 月前