Favicon 401 or 404 Error in Angular Single Page Applications (SPA)

This was an issue I recently encountered involving 401 & 404 HTTP errors generated for the Favicon.ico file in an Angular Single Page Application (SPA) that was built by a vendor that I’m servicing now for a customer.

Neither Chrome nor Microsoft Edge complained as much as Firefox did about the Favicon error. I can’t stand to see errors in applications so I had to find a way to solve this.

Luckily, after a bit of searching, I had found this discussion on StakeOverFlow about the Favicon throwing in error like this.

The Favicon Fix for Angular Apps

Use this “shortcut icon” tag instead of the favicon tag.

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

This simple fix resolved my issue and I no longer see any 401 Unauthorized or 404 Not Found errors involving the favion.ico file in my Angular application.

As always, I hope this little snippet of knowledge helps someone. 😉

~Cyber Abyss

Author: Rick Cable / AKA Cyber Abyss

A 16 year US Navy Veteran with 25+ years experience in various IT Roles in the US Navy, Startups and Healthcare. Founder of FinditClassifieds.com in 1997 to present and co-founder of Sports Card Collector Software startup, LK2 Software 1999-2002. For last 7 years working as a full-stack developer supporting multiple agile teams and products in a large healthcare organization. Part-time Cyber Researcher, Aspiring Hacker, Lock Picker and OSINT enthusiast.