如何防止favicon.ico请求？

548

我没有favicon.ico，但IE总是对此提出要求。

是否可以防止浏览器从我的网站请求网站图标？也许在HTML标头中有一些META-TAG？

favicon 
— 丹尼尔·西尔维拉（Daniel Silveira）
source
21
+1好问题，但似乎最简单的解决方案只是添加一个有效的网站图标:-)当然，这是一分钟的工作，您的网站马上看起来更专业吗？
— 马特·威尔科
4
您也可以有一个空的favicon.ico文件。这将停止请求（在第一个请求之后），但不会导致浏览器在其通常呈现其默认图标的位置呈现空白图标。
— mxcl 2012年
38
我必须说，我完全同意提问者的隐含观点：出于什么目的，必须使某些额外内容成为强制性的？再者，我们不能简单地向响应中添加一些元数据，说“行为就像您请求了favicon.ico并获得了404一样，只是不要真正提出请求，而且不要再询问，直到此页面更改”。
— 丹尼尔（Daniel）
36
真是痛苦。我有一个仅提供JSON的网络服务，甚至没有提供不做任何更改即可提供文件的基本功能（首先，每种方法都需要一个auth令牌来避免401/403）。我记录失败的请求，以便以后进行分析-日志中不断出现对收藏图标的请求。
— 基本
3
是2015年。有什么新闻吗？
— 乔纳森·普拉茨

Answers:

573

首先，我要说的是，在网页中添加收藏夹图标是一件好事（通常）。

但是，并非总是如此，开发人员有时需要一种避免额外负载的方法。例如，IFRAME会在不显示图标的情况下请求图标。最糟糕的是，在Chrome和Android中，IFRAME会生成3个网站图标请求：

"GET /favicon.ico HTTP/1.1" 404 183
"GET /apple-touch-icon-precomposed.png HTTP/1.1" 404 197
"GET /apple-touch-icon.png HTTP/1.1" 404 189

以下使用数据URI，可用于避免伪造的favicon请求：

<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">

有关参考，请参见此处：

Chrome的错误/行为可能会在即将发布的版本中修复。

以下是提交的错误供您投票：

更新1：

从注释（jpic）看来，Firefox> = 25不再喜欢上述语法。我在Firefox 27上进行了测试，但是在Webkit / Chrome上仍然可以正常运行。

因此，这里是应该涵盖所有最新浏览器的新版本。我测试了Safari，Chrome和Firefox：

<link rel="icon" href="data:;base64,=">

我从“ rel”属性值中省略了“快捷方式”名称，因为这仅适用于较旧的IE，而IE <8的版本也不喜欢dataURIs。未经IE8测试。

更新2：

如果您需要文档来针对HTML5进行验证，请改用以下方法：

<link rel="icon" href="data:;base64,iVBORw0KGgo=">
— 迭戈·佩里尼（Diego Perini）
source
1
辉煌。我不得不猜测一个事实，就是您获得的选票很少，这仅与以下事实有关：自提出问题以来已经过去了几年，而不太聪明的答案却有更多的时间来收集选票。
— iconoclast
20
您的UPDATE 2在Lollipop上有问题...添加<link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=">似乎可以解决该问题。
— Alko 2015年
2
如果我做对了，我可以data:image/png;base64,iVBORw0KGgo=在浏览器中打开，也将其另存为favicon.ico。清空PNG文件并将其存储在网站根目录中。对？
— 马丁
3
@Alko那个空的PNG文件仍然无效。如果这仅是为了创建描述空文件的数据URL，请使用：<link rel =“ icon” href =“ data：，”>
— vog
2
即使index.html文件中没有对它的引用，浏览器也倾向于请求该图标，那么该解决方案将如何防止这种情况发生？具体来说，我发现Firefox在您访问域后就非常积极地要求它。其他浏览器可能会在以后执行此操作，可能是在索引文件加载了标头之后（请进一步了解浏览器内部知识的人发表评论）。没有一个图标具有潜在的副作用，它只是谷歌，或：stackoverflow.com/questions/4269695/...
— juanheyns
131

只需将以下行添加到<head>HTML文件的部分：

<link rel="icon" href="data:,">

该解决方案的特点：

  • 100％有效的HTML5
  • 很短
  • 不会引起IE 8及更高版本的怪癖
  • 不会使浏览器将当前的HTML代码解释为favicon（会是这种情况href="#"）
— 沃格
source
4
如果您只是想关闭本地项目上的chrome devtools，那么这是迄今为止最简单，最干净的方法。
— 安德鲁（Andrew）
请对此进行扩展。我是否只需要在HTML文件中包含它即可停止网站图标的请求？
— Aakash Verma
2
@AakashVerma是的，仅此而已。不需要什么了。（除非您的站点需要支持Internet Explorer 8或更早版本。）我相应地改进了答案。
— vog
@asynts是什么意思reserves space？
— mvorisek
@Andrew此解决方案的Chrome DevTools有什么问题？
— 弗林施
47

我相信我已经看过 （虽然我尚未测试或亲自使用它）：

<link rel="shortcut icon" href="#" />

有人有类似的经历吗？

编辑：

我刚刚测试了上述代码段，并在强制完全刷新的情况下，在Fiddler中未看到任何图标图标请求。我针对IE8（作为IE7标准的兼容模式）和FF ​​3.6进行了测试。

— mlhDev
source
1
我的测试还表明该技巧有效。但是，我将href链接到您已经加载的某些静态（缓存）资源（例如CSS或脚本文件）-以确保不会两次请求动态（非缓存）页面。（为了安全起见，因为从href="#"技术上讲指向当前网页）。
— 三月Örlygsson
2
我在Safari中尝试过。网站图标请求再次进入托管页面。
— Morgan Cheng
27
我不建议这样做，因为它使浏览器（Safari5 / Mac，也许还有其他浏览器）两次从服务器请求网页。
— Manav
2
@Manav在Safari6 / Mac中不再是这种情况。
— Marcel
2
OM！谢谢：D现在，直到我终于开始制作那个图标了，我才看不到那个烦人的错误。
— 里昂·加班
39

你不能 所有你能做的是使图像尽可能小，并设置一些缓存失效报头（Expires，Cache-Control）在不远的将来。这就是Yahoo! 必须说一下favicon.ico的要求。

— 爱奥努·G·斯坦
source
7
他说他没有收藏夹图标。它们不会比这小得多。缓存不存在的文件没有任何意义。
— innaM
16
如果他没有收藏夹图标，那么他应该制作一个，这是我的观点。没有比这更好的解决方案了。这不合逻辑吗？如果无法停止请求，除非使用缓存，该怎么办？
— Ionuț G. Stan，
5

您可以使用.htaccess或服务器指令拒绝对favicon.ico的访问，但是服务器将向浏览器发送拒绝访问的回复，这仍然会降低页面访问速度。

当用户返回您的站点时，可以通过使其停留在浏览器缓存中来停止浏览器请求favicon.ico。

首先，提供一个小的favicon.ico图像，该图像可以为空白，但应尽可能小。我在200个字节以下制作了一个黑白的。然后，使用.htaccess或服务器指令，将文件Expires标头设置为将来的一两个月。当同一用户返回您的站点时，它将从浏览器缓存中加载，并且不会有任何请求进入您的站点。服务器日志中也没有更多的404。

如果您可以控制完整的Apache服务器或虚拟服务器，则可以执行以下操作：

如果服务器文档的根目录是/ var / www / html，则将其添加到/etc/httpd/conf/httpd.conf：

Alias /favicon.ico "/var/www/html/favicon.ico"
<Directory "/var/www/html">
    <Files favicon.ico>
       ExpiresActive On
       ExpiresDefault "access plus 1 month"
    </Files>
</Directory>

然后，一个favicon.ico将对所有虚拟托管站点起作用，因为您对其进行了别名。用户访问后一个月，它将从浏览器缓存中提取。

对于.htaccess，据报道该文件有效（我未检查）：-

AddType image/x-icon .ico
ExpiresActive On
ExpiresByType image/x-icon "access plus 1 month"
— 匿名1
source
不要忘记启用模块：〜/ etc / apache2＃a2enmod过期&&服务apache2重新启动
— Sino Boeckmann
4

如果您使用nginx 

# skip favicon.ico
#
location = /favicon.ico {
    access_log off;
    return 204;
}
— 文森特·厘米
source
这不会阻止请求，但是我喜欢它作为替代。
— QasimK '18
当然可以，如果您可以控制Web服务器。
— jbruni
1

在Node.js中，

res.writeHead(200, {'Content-Type': 'text/plain', 'Link': 'rel="shortcut icon" href="#"'} );
— Visv M
source
0

根据我们的经验，Apache应favicon.ico的要求而落伍，我们在.htaccess文件中注释掉了额外的标头。

例如，我们将标头设置为X-XSS-Protection“ 1; mode = block”

...但是我们已经忘记了预先使用sudo a2enmod标头。注释掉要发送的额外标题可解决我们的favicon.ico问题。

我们还为开发设置了多个虚拟主机，并且在使用http：// localhost和访存/favicon.ico 时仅因500内部服务器错误而失败。如果您运行“ curl -v http：//localhost/favicon.ico ”并收到有关主机名不在解析器高速缓存中或类似结果的警告，则可能会遇到问题。

它可能很简单，例如不进行获取（我们尝试了这一操作，但由于我们的根本原因不同，所以不起作用），或者在apache2.conf或.htaccess中四处寻找指令，这可能会引起奇怪的500 Internal Server Error消息。

我们发现它是如此之快地失败了，Apache的错误日志中没有任何有用的东西，并且整个上午都在这里更改那里的小事情，直到我们解决了忘记加载mod_headers时设置额外标题的问题！

— J·德克兰·扬
source
0

有时，当HTML包含一些注释的代码并且浏览器试图查找某些内容时，就会出现此错误。就像在我的案例中一样，我在flask中注释了Web表单的代码，而我正在得到它。

花了2个小时后，我通过以下方式对其进行了修复：

1）我创建了一个新的python环境，然后在注释的HTML行上引发了一个错误，在此之前，我仅引发了错误“ GET /favicon.ico HTTP / 1.1” 404”

2）有时，当我有重复的代码（例如存在相同名称的python文件）时，我也看到此错误，请尝试将其删除

— ohsoifelse
source
-10

你可以用

<link rel="shortcut icon" href="http://localhost/" />

这样，实际上不会从服务器请求它。

— 乔希
source
1
看来这可能会导致某些浏览器抛出可怕的错误消息-此外，您还必须提防在可能通过HTTPS服务的页面上使用该技巧。
— Brighid McDonnell
6
使用about：blank更好。
— 路加
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.