Logo Questions Linux Laravel Mysql Ubuntu Git Menu
 

Favicon request not showing in network tab of developer toolbars

Tags:

I've set up my ASP.NET MVC app with a favicon in the Content folder (instead of the root) along these lines. This works well, the favicon shows in all browsers.

However when I installed ELMAH I started seeing 404 errors because apparently the favicon is still being requested at the root of my site! I would love to know why this is happening and who is doing this. Under the assumption my browser was causing this I opened up the developer toolbars, here's what I find:

Google Chrome:
Developer toolbar, network tab in Chrome

Internet Explorer 9:
Developer toolbar, network tab in IE9

Firefox:
Developer toolbar, network tab in Firefox

All of them show 9 similar requests, but none of them show favicon.ico requests ... at all? I would've expected at least one (the one in the Content folder, which I'm seeing in my browser), and rather even two (also the one that's giving me the 404 in ELMAH).

So, my question: Can anyone explain why developer toolbars generally don't show favicon requests? Can this be turned on somehow or seen somewhere?

like image 759
Jeroen Avatar asked Dec 19 '12 21:12

Jeroen


People also ask

How do I find the request in network tab?

Simply go to the page and open the network tab. You can see the network tab by hitting cmd + opt + j on your Mac or ctrl + shift + j in Windows. It will open up the console tab in DevTools by default. Once the console tab is open, simply click on the network tab to make it visible.

Where is the favicon in inspect element?

Why don't you just right click on the page and select inspect element ? That gives you the html code of the page and the favicon is listed there. Just click on the link.


1 Answers

All browsers fetch /favicon.ico by default to use it in the address bar, tabs, bookmarks etc. It's just a convention (and W3C doesn't like it).

Using Chrome you can see this request here: chrome://net-internals/#events.

net-internals events panel

You can override the icon using <link rel="shortcut icon" href="http://test.com/myicon.ico" /> HTML tag in the <head> section. This seems to prevent Chrome from checking the default location. However, even with this tag set up Chrome DevTools are not displaying favicon.ico as a resource that was downloaded during the page load. The reason for this may be that favicon is not used by the website, it's used by the browser. The browser request it for it's own purposes.

[EDIT] There is an open Chrome issue classifying missing favicon.ico in the Network panel as a bug. [EDIT] Its also a bug in a Firebug.

like image 126
Konrad Dzwinel Avatar answered Oct 13 '22 00:10

Konrad Dzwinel