Обслуживание favicon.ico в ASP.NET MVC


255

Какова последняя / лучшая рекомендация о том, как обслуживать favicon.ico в ASP.NET MVC?

В настоящее время я делаю следующее:

  • Добавление записи в самое начало моего метода RegisterRoutes:

    routes.IgnoreRoute("favicon.ico");
  • Размещение favicon.ico в корне моего приложения (которое также будет корнем моего домена).

У меня есть два вопроса:

  • Нет ли способа поместить favicon.ico куда-нибудь, кроме корня моего приложения. Это довольно странно, быть на том же уровне, что Contentи Controllers.
  • IgnoreRoute("favicon.ico")Достаточно ли этого утверждения - или я должен также сделать следующее, как обсуждалось в блоге Фила Хаака . Я не знаю, чтобы когда-либо видел запрос к favicon.ico в любом каталоге, кроме корневого, что сделало бы это ненужным (но полезно знать, как это сделать).

    routes.IgnoreRoute("{*favicon}", new {favicon=@"(.*/)?favicon.ico(/.*)?"});

4
Ваше регулярное выражение должно быть '\.' для точки в favicon.ico, а не просто «.».
NathanAldenSr

1
Это то, что я использую (учитывает рекомендации @NathanAldenSr, поддерживает как прямую, так и обратную косую черту, а также допускает файлы favicon.png):routes.IgnoreRoute("{*favicon}", new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" });
BrainSlugs83

@ BrainSlugs83 - Ваше решение добавило недостающую часть для меня, которая была косой чертой ... Вот версия .NET vNext (бета-5). routes.MapRoute("IgnoreFavicon", "{*favicon}", new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" });
Rentering.com

Исправление, vNext routes.MapRoute("Ingore", "{*favicon}", new { }, new { favicon = @"(.*[/\\])?favicon\.((ico)|(png))(/.*)?" }); Проигнорируйте Уведомление о маршруте thew new {},
Rentering.com

Ответы:


204

Размещение favicon.ico в корне вашего домена действительно влияет только на IE5, IIRC. Для более современных браузеров вы должны иметь возможность включить тег ссылки, указывающий на другой каталог:

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

Вы также можете использовать файлы не-ico для браузеров, отличных от IE, для которых я мог бы использовать следующий условный оператор для обслуживания PNG в FF и т. Д. И 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]-->

25
Вам нужно использовать @ Url.Content для генерации ссылки, чтобы она работала во всех средах. Смотрите ответ
AlexC

5
Правда для ASP.NET. Мой ответ иллюстрирует «универсальную» версию (обычный HTML), поэтому любой может изменить ее в соответствии со своим выбором фреймворка / языка :)
Крис

Это важно отметить , что IE10 не поддерживает условные комментарии, так что это не будет работать для пользователей с этим браузером. Решением было бы добавить ваш значок в корневой каталог вашего сайта, который IE10 автоматически выберет, если нигде не найдет ссылку для значка.
Кевин Бэбкок

2
IE11 Понимают PNG favicon и не нуждаются в условных выражениях. Вы должны увидеть эту хорошую статью: jonathantneal.com/blog/understand-the-favicon
QMaster

Спасибо, чувак! Нижняя часть действительно помогает мне работать с png, она просто должна быть вверху страницы, главной страницы или макета.
Alper

226

Я согласен с ответом Криса, но, учитывая, что это конкретный вопрос ASP.NET MVC, было бы лучше использовать любой синтаксис Razor:

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

Или традиционно

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

скорее, чем

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

3
Правда. Мой ответ был иллюстрирующую «общий» версия (HTML), так что каждый может изменить в соответствии с их выбор рамок / языка :)
Chris

2
@Diego - Да, rel = "ЗНАЧОК ШОРТКУ" - это нестандартная реализация, используемая Internet Explorer. Пробел является символом-разделителем в стандартах W3C (см. Developer.mozilla.org/en-US/docs/Web/HTML/Element/link ). В браузерах, отличных от Internet Explorer, правильный синтаксис: <link rel = "icon" href = "path / to / favicon.ico"> - см. Jonathantneal.com/blog/understand-the-favicon для получения дополнительной информации. Очевидно, что вы можете использовать синтаксис Razor или Web Forms для пути к значку, как указано выше.
pwdst

3
С MVC 4 вам не понадобится Url.Content в этом случае, так как он будет обрабатываться автоматически, вы можете просто использовать; <link rel = "icon" href = "~ / content / favicon.ico" />
Стюарт Хэллоуз

20

1) Вы можете поместить свой значок сайта в нужное место и добавить этот тег в заголовок страницы.

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

хотя некоторые браузеры по умолчанию пытаются получить значок из /favicon.ico, поэтому вы должны использовать IgnoreRoute.

2) Если браузер сделает запрос на значок в другом каталоге, он получит ошибку 404, что нормально, и если у вас есть тег ссылки в ответе 1 на главной странице, браузер получит нужный значок.


2
браузеры будут искать файл .ico, если вы добавите сайт в закладки, так что это не поможет. но мне интересно, запоминает ли браузер это. я просто знаю, что в Fiddler иногда я вижу целую кучу найденных иконок. возможно, это панель инструментов Google, хотя?
Simon_Weaver

я думаю, что вы правы, значки для закладок иногда работают, я никогда не понимал, почему, может быть, это так
Эдуардо Кампаньо

7

Я думаю, что favicon.ico должен быть в корневой папке. Это просто принадлежит там.

Если вы хотите обслуживать разные иконки - поместите его в контроллер. Вы можете сделать это. Если нет - просто оставьте его в корневой папке.


1
Я согласен. Он находится в корневой папке и не должен быть где-либо еще ... Нет необходимости в HTML-теге для значка, если он находится в корневой папке. Работает со всеми распространенными браузерами ...
Vinz

Сначала мне это показалось абсолютным буллом, но, очевидно, нет никакого способа обойти это, наша логистика продолжает показывать 404 ошибки от различных пользовательских агентов.
Michiel Cornille

3

Ничто из вышеперечисленного не помогло мне. Я наконец-то решил эту проблему, переименовав favicon.ico в myicon.ico и сославшись на это в голове<link rel="icon" href="~/myicon.ico" type="image/x-icon" />


2

Также должна быть возможность создать контроллер, который возвращает файл ico, и зарегистрировать маршрут /favicon.ico, указывающий на этот контроллер.


2

Все, что вам нужно сделать, это добавить app.UseStaticFiles();в свой startup.cs -> public void Configure(IApplicationBuilder app, IHostingEnvironment env).

Ядро ASP.net предоставляет отличный способ получить статические файлы. Это использует папку wwwroot. Пожалуйста, прочитайте статические файлы в ASP.NET Core .

Использование <Link />не очень хорошая идея. Зачем кому-то добавлять тег ссылки на каждый HTML или cshtml для favicon.ico?


0

Используйте это вместо просто favicon.ico, который имеет тенденцию искать файл значка fav

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

Используйте запрошенный путь и объедините его с файлом значков избранного, чтобы он получил точный адрес, который ищет

Использование этого решило ошибку Fav.icon, которая всегда возникает в Application_Error


0

Обнаружил, что в .Net Core решение проблемы с размещением favicon.ico в / lib вместо wwwroot устраняет проблему.

Используя наш сайт, вы подтверждаете, что прочитали и поняли нашу Политику в отношении файлов cookie и Политику конфиденциальности.
Licensed under cc by-sa 3.0 with attribution required.