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. 😉