favicon - 如何阻止 favicon.ico 请求？

Question

我没有 favicon.ico，但我的浏览器总是发出请求。

是否可以阻止浏览器从我的网站发出对网站图标的请求？也许 HTML header 中有一些 META-TAG？

Answer 1

我首先要说的是，网页中包含网站图标是一件好事(通常)。

然而，这并不总是理想的，有时开发人员需要一种方法来避免额外的有效负载。例如，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，可用于避免虚假的网站图标请求:

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

有关引用，请参见此处:

• https://github.com/h5bp/html5-boilerplate/issues/1103
• https://twitter.com/diegoperini/status/4882543836930048

更新1:

从评论(jpic)看来，Firefox >= 25 不再喜欢上述语法。我在 Firefox 27 上进行了测试，它无法工作，但在 Webkit/Chrome 上仍然可以工作。

所以这是一个应该涵盖所有最新浏览器的新浏览器。我测试了 Safari、Chrome 和 Firefox:

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

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

更新2:

如果您需要您的文档针对 HTML5 进行验证，请使用此选项:

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