Servant favicon.ico dans ASP.NET MVC

255

Quelle est la recommandation finale / meilleure sur la façon de servir favicon.ico dans ASP.NET MVC?

Je fais actuellement ce qui suit:

Ajout d'une entrée au tout début de ma méthode RegisterRoutes:
```
routes.IgnoreRoute("favicon.ico");
```
Placer favicon.ico à la racine de mon application (qui sera également la racine de mon domaine).

J'ai deux questions:

N'y a-t-il aucun moyen de placer le favicon.ico ailleurs que la racine de mon application. C'est assez bizarre d'être là au même niveau que Contentet Controllers.
Cette IgnoreRoute("favicon.ico")déclaration est-elle suffisante - ou devrais-je également faire ce qui suit comme discuté dans un article de blog de Phil Haack . Je ne suis pas au courant d'avoir jamais vu une demande à favicon.ico dans un répertoire autre que la racine - ce qui rendrait cela inutile (mais il est bon de savoir comment le faire).
```
routes.IgnoreRoute("{*favicon}", new {favicon=@"(.*/)?favicon.ico(/.*)?"});
```

— Simon_Weaver
source

4

Votre expression régulière doit être «\». pour le point dans favicon.ico, pas seulement '.'.

— NathanAldenSr

1

C'est ce que j'utilise (il prend en compte les conseils de @ NathanAldenSr, prend en charge les barres obliques avant et arrière et permet également les fichiers favicon.png):routes.IgnoreRoute("{*favicon}", new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" });

— BrainSlugs83

@ BrainSlugs83 - Votre solution a ajouté la pièce manquante pour moi qui était les barres obliques ... Voici une version .NET vNext (beta-5). routes.MapRoute("IgnoreFavicon", "{*favicon}", new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" });

— Rentering.com

Correction, vNext Ignore Route routes.MapRoute("Ingore", "{*favicon}", new { }, new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" }); Avis thew new {},

— Rentering.com

204

Placer favicon.ico à la racine de votre domaine n'affecte vraiment que IE5, IIRC. Pour les navigateurs plus modernes, vous devriez pouvoir inclure une balise de lien pour pointer vers un autre répertoire:

<link rel="SHORTCUT ICON" href="http://www.mydomain.com/content/favicon.ico"/>

Vous pouvez également utiliser des fichiers non ico pour les navigateurs autres que IE, pour lesquels j'utiliserais peut-être l'instruction conditionnelle suivante pour servir un PNG à FF, etc., et un ICO à IE:

<link rel="icon" type="image/png" href="http://www.mydomain.com/content/favicon.png" />
<!--[if IE]>
<link rel="shortcut icon" href="http://www.mydomain.com/content/favicon.ico" type="image/vnd.microsoft.icon" />
<![endif]-->

— Chris
source

25

Vous devez utiliser @ Url.Content pour générer le lien afin qu'il fonctionne dans tous les environnements. Voir la réponse d'

— AlexC

5

Vrai, pour ASP.NET. Ma réponse illustre la version "générique" (HTML simple), donc tout le monde peut la modifier pour l'adapter à son choix de framework / langage :)

— Chris

Il est important de noter que IE10 ne prend pas en charge les commentaires conditionnels, donc cela ne fonctionnera pas pour les utilisateurs avec ce navigateur. Une solution serait d'ajouter votre favicon au répertoire racine de votre site, qu'IE10 récupérera automatiquement s'il ne trouve aucun lien pour un favicon n'importe où.

— Kevin Babcock

2

IE11 Comprenez le favicon PNG et n'avez pas besoin de déclaration conditionnelle. Vous devriez voir ce bon article: jonathantneal.com/blog/understand-the-favicon

— QMaster

Merci mec! La partie inférieure m'aide vraiment à travailler avec png, elle doit simplement être en haut de la page, de la page principale ou de la mise en page.

— Alper

226

Je suis d'accord avec la réponse de Chris, mais vu qu'il s'agit d'une question spécifique ASP.NET MVC, il serait préférable d'utiliser la syntaxe Razor:

<link rel="icon" href="@Url.Content("~/content/favicon.ico")"/>

Ou traditionnellement

<link rel="icon" href="<%= Url.Content("~/content/favicon.ico") %>"/>

plutôt que

<link rel="icon" href="http://www.mydomain.com/content/favicon.ico"/>

— AlexC
source

3

Vrai. Ma réponse était d'illustrer la version "générique" (HTML), donc tout le monde pouvait la modifier en fonction de son choix de framework / langage :)

— Chris

2

@Diego - Oui, rel = "SHORTCUT ICON" est une implémentation non standard utilisée par Internet Explorer. L'espace est un caractère séparateur dans les normes W3C (voir developer.mozilla.org/en-US/docs/Web/HTML/Element/link ). Dans les navigateurs autres qu'Internet Explorer, la syntaxe correcte est <link rel = "icon" href = "path / to / favicon.ico"> - voir jonathantneal.com/blog/understand-the-favicon pour en savoir plus. Évidemment, vous pouvez utiliser la syntaxe Razor ou Web Forms pour le chemin d'accès à l'icône comme ci-dessus.

— pwdst

3

Avec MVC 4, vous n'aurez pas besoin du contenu Url.Content dans ce cas car cela sera géré automatiquement, vous pouvez simplement utiliser; <link rel = "icon" href = "~ / content / favicon.ico" />

— Stuart Hallows

20

1) Vous pouvez placer votre favicon où vous voulez et ajouter cette balise à votre tête de page

<link rel="shortcut icon" href="images/favicon.ico" type="image/x-icon" />

bien que certains navigateurs essaient d'obtenir le favicon de /favicon.ico par défaut, vous devez donc utiliser IgnoreRoute.

2) Si un navigateur fait une demande pour le favicon dans un autre répertoire, il obtiendra une erreur 404 qui est très bien et si vous avez la balise de lien dans la réponse 1 dans votre page maître, le navigateur obtiendra le favicon que vous voulez.

— Eduardo Campañó
source

2

les navigateurs iront chercher le fichier .ico si vous ajoutez un signet au site - cela n'aide donc pas. mais je me demande si le navigateur s'en souvient. je sais juste que dans Fiddler, je vois parfois toute une série d'icônes récupérées. c'est peut-être la barre d'outils Google cependant?

— Simon_Weaver

je pense que vous avez raison, les icônes pour les signets ne fonctionnent que parfois, je n'ai jamais compris pourquoi, c'est peut-être le cas

— Eduardo Campañó

7

Je pense que favicon.ico devrait être dans le dossier racine. Il appartient juste là.

Si vous souhaitez servir différentes icônes - mettez-le dans le contrôleur. Vous pouvez le faire. Sinon - laissez-le simplement dans le dossier racine.

— dmajkic
source

1

Je suis d'accord. Il est dans le dossier racine et ne devrait pas être ailleurs ... Il n'est pas nécessaire d'avoir une balise HTML pour le favicon s'il se trouve dans le dossier racine. Fonctionne avec tous les navigateurs courants ...

— Vinz

Au début, cela me semblait être un taureau absolu, mais apparemment, il n'y a aucun moyen de le contourner, notre journalisation affiche toujours 404 erreurs provenant de différents agents utilisateurs.

— Michiel Cornille

3

Rien de ce qui précède n'a fonctionné pour moi. J'ai finalement résolu ce problème en renommant favicon.ico en myicon.ico et en le référençant dans la tête<link rel="icon" href="~/myicon.ico" type="image/x-icon" />

— Tracy Zhou
source

2

Il devrait également être possible de créer un contrôleur qui renvoie le fichier ico et d'enregistrer la route /favicon.ico pour pointer vers ce contrôleur.

— Société Carles
source

2

Tout ce que vous avez à faire est d'ajouter app.UseStaticFiles();votre startup.cs -> public void Configure(IApplicationBuilder app, IHostingEnvironment env).

Le noyau ASP.net fournit un excellent moyen d'obtenir des fichiers statiques. Cela utilise le dossier wwwroot. Veuillez lire les fichiers statiques dans ASP.NET Core .

Utiliser le <Link />n'est pas une très bonne idée. Pourquoi quelqu'un ajouterait-il la balise de lien sur chaque HTML ou cshtml pour le favicon.ico?

— Ripal Barot
source

0

Utilisez-le au lieu de simplement favicon.ico qui a tendance à rechercher le fichier d'icône fav

> <link rel="ICON" 
> href="@System.IO.Path.Combine(Request.PhysicalApplicationPath,
> "favicon.ico")" />

Utilisez le chemin demandé et combinez-le avec le fichier d'icônes fav afin qu'il obtienne l'adresse précise que sa recherche

L'utilisation de ceci a résolu l'erreur Fav.icon qui est toujours déclenchée sur Application_Error

— Tribhuvan Patel
source

0

J'ai trouvé que dans .Net Core, placer le favicon.ico dans / lib plutôt que wwwroot résout le problème

— Dimitris Kouris
source