Udostępnianie favicon.ico w ASP.NET MVC

255

Jaka jest ostateczna / najlepsza rekomendacja dotycząca sposobu obsługi favicon.ico w ASP.NET MVC?

Obecnie wykonuję następujące czynności:

Dodanie wpisu na samym początku mojej metody RegisterRoutes:
```
routes.IgnoreRoute("favicon.ico");
```
Umieszczenie favicon.ico w katalogu głównym mojej aplikacji (która również będzie katalogiem głównym mojej domeny).

Mam dwa pytania:

Czy nie ma sposobu, aby umieścić favicon.ico w innym miejscu niż katalog główny mojej aplikacji. To jest dość niegrzeczne, będąc na tym samym poziomie co Contenti Controllers.
Czy to IgnoreRoute("favicon.ico")oświadczenie jest wystarczające - czy powinienem również wykonać następujące czynności, jak omówiono w poście na blogu Phila Haacka . Nie wiem, czy kiedykolwiek widziałem prośbę do favicon.ico w katalogu innym niż root - co spowodowałoby, że byłoby to niepotrzebne (ale dobrze jest wiedzieć, jak to zrobić).
```
routes.IgnoreRoute("{*favicon}", new {favicon=@"(.*/)?favicon.ico(/.*)?"});
```

— Simon_Weaver
źródło

4

Twoje wyrażenie regularne powinno brzmieć „\”. dla kropki w favicon.ico, nie tylko „.”.

— NathanAldenSr

1

To jest to, czego używam (bierze pod uwagę porady @ NathanAldenSr, obsługuje zarówno ukośniki do przodu, jak i do tyłu, a także pozwala na pliki favicon.png):routes.IgnoreRoute("{*favicon}", new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" });

— BrainSlugs83

@ BrainSlugs83 - Rozwiązaniem dodałeś dla mnie brakujący kawałek, który był ukośnikiem ... Oto wersja .NET vNext (beta-5). routes.MapRoute("IgnoreFavicon", "{*favicon}", new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" });

— Rentering.com,

Korekta, vDalej Zignoruj trasę routes.MapRoute("Ingore", "{*favicon}", new { }, new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" }); Zawiadomienie thew new {},

— Rentering.com,

204

Umieszczenie favicon.ico w katalogu głównym domeny naprawdę wpływa tylko na IE5, IIRC. W przypadku nowocześniejszych przeglądarek powinno być możliwe dołączenie znacznika odsyłacza do innego katalogu:

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

Możesz również użyć plików innych niż ico dla przeglądarek innych niż IE, dla których być może użyłbym następującej instrukcji warunkowej do obsługi plików PNG w FF itp. Oraz ICO w 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
źródło

25

Musisz użyć @ Url.Content, aby wygenerować link, aby działał we wszystkich środowiskach. Zobacz odpowiedź

— AlexC

5

To prawda, dla ASP.NET. Moja odpowiedź ilustruje wersję „ogólną” (zwykły HTML), więc każdy może modyfikować, aby dopasować do swojego frameworku / języka :)

— Chris

Jest ważne , aby pamiętać, że IE10 nie obsługuje komentarzy warunkowych, więc to nie będzie działać dla użytkowników tej przeglądarki. Rozwiązaniem byłoby dodanie favicon do katalogu głównego witryny, który IE10 pobierze automatycznie, jeśli nigdzie nie znajdzie linku do favicon.

— Kevin Babcock

2

IE11 Zrozum favicon PNG i nie trzeba instrukcji warunkowej. Powinieneś zobaczyć ten dobry artykuł: jonathantneal.com/blog/understand-the-favicon

— QMaster

Dzięki koleś! Dolna część naprawdę pomaga mi w pracy z png, po prostu musi znajdować się na górze strony, na stronie głównej lub w układzie.

— Alper

226

Zgadzam się z odpowiedzią Chrisa, ale widząc to konkretne pytanie ASP.NET MVC, lepiej byłoby użyć dowolnej składni Razor:

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

Lub tradycyjnie

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

zamiast

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

— AlexC
źródło

3

Prawdziwe. Moja odpowiedź była ilustrujący „ogólnych” wersji (HTML), więc każdy może modyfikować, aby dostosować ich wybór ramowej / języku :)

— Chris

2

@Diego - Tak, rel = "IKONA SKRÓTU" jest niestandardową implementacją używaną przez Internet Explorera. Spacja jest znakiem separatora w standardach W3C (patrz developer.mozilla.org/en-US/docs/Web/HTML/Element/link ). W przeglądarkach innych niż Internet Explorer poprawna składnia jest <link rel = "icon" href = "ścieżka / do / favicon.ico"> - patrz jonathantneal.com/blog/understand-the-favicon więcej. Oczywiście możesz użyć składni Razor lub Web Forms do ścieżki do ikony jak wyżej.

— pwdst

3

Z MVC 4 nie potrzebujesz w tym przypadku Url.Content, ponieważ będzie on obsługiwany automatycznie, możesz po prostu użyć; <link rel = "icon" href = "~ / content / favicon.ico" />

— Stuart Hallows

20

1) Możesz umieścić swoją ulubioną stronę w dowolnym miejscu i dodać ten tag do nagłówka strony

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

chociaż niektóre przeglądarki domyślnie spróbują pobrać favicon z /favicon.ico, więc powinieneś użyć IgnoreRoute.

2) Jeśli przeglądarka poprosi o favicon w innym katalogu, otrzyma błąd 404, co jest w porządku, a jeśli masz link link w odpowiedzi 1 na stronie wzorcowej, przeglądarka otrzyma favicon, który chcesz.

— Eduardo Campañó
źródło

2

przeglądarki dodadzą plik .ico, jeśli dodasz stronę do zakładek - więc to nie pomaga. ale zastanawiam się, czy przeglądarka to pamięta. po prostu wiem, że w Fiddler czasami widzę całą masę ikon. może to jest pasek narzędzi Google?

— Simon_Weaver

myślę, że masz rację, ikony zakładek tylko czasem działają, nigdy nie zrozumiałem dlaczego, może tak jest

— Eduardo Campañó

7

Myślę, że favicon.ico powinien znajdować się w folderze głównym. Po prostu tam należy.

Jeśli chcesz serwować różne ikony - włóż to do kontrolera. Możesz to zrobić. Jeśli nie - zostaw go w folderze głównym.

— dmajkic
źródło

1

Zgadzam się. Znajduje się w folderze głównym i nie powinno być nigdzie indziej ... Nie ma potrzeby używania znacznika HTML dla favicon, jeśli znajduje się on w folderze głównym. Działa ze wszystkimi popularnymi przeglądarkami ...

— Vinz

Na początku wydawało mi się, że to absolutny byk, ale najwyraźniej nie można tego obejść, nasze rejestrowanie pokazuje 404 błędy różnych aplikacji klienckich.

— Michiel Cornille,

3

Żadne z powyższych nie działało dla mnie. W końcu rozwiązałem ten problem, zmieniając nazwę favicon.ico na myicon.ico i odwołując się do niego w głowie<link rel="icon" href="~/myicon.ico" type="image/x-icon" />

— Tracy Zhou
źródło

2

Powinno być także możliwe utworzenie kontrolera, który zwraca plik ico i zarejestrowanie trasy /favicon.ico w celu wskazania tego kontrolera.

— Firma Carles
źródło

2

Wszystko, co musisz zrobić, to dodać app.UseStaticFiles();w pliku startup.cs -> public void Configure(IApplicationBuilder app, IHostingEnvironment env).

Rdzeń ASP.net zapewnia doskonały sposób na uzyskanie plików statycznych. To jest za pomocą folderu wwwroot. Proszę przeczytać pliki statyczne w ASP.NET Core .

Korzystanie z <Link />nie jest zbyt dobrym pomysłem. Dlaczego ktoś miałby dodawać tag linku do każdego kodu HTML lub cshtml dla pliku favicon.ico?

— Ripal Barot
źródło

0

Użyj tego zamiast tylko favicon.ico, który zwykle szuka pliku ikony fav

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

Użyj żądanej ścieżki i połącz z plikiem ikony fav, aby uzyskać dokładny adres, którego szuka

Za pomocą tego rozwiązano błąd Fav.icon, który jest zgłaszany zawsze w błędzie Application_Error

— Tribhuvan Patel
źródło

0

Stwierdzono, że w .Net Core umieszczenie favicon.ico w / lib zamiast wwwroot rozwiązuje problem

— Dimitris Kouris
źródło