Как предотвратить запросы favicon.ico?

551

У меня нет favicon.ico, но IE всегда делает запрос на него.

Можно ли запретить браузеру отправлять запрос на избрание с моего сайта? Может быть, есть мета-тег в заголовке HTML?

favicon Даниэль Сильвейра
источник
21
+1 хороший вопрос, но кажется, что самое простое решение - просто добавить действительный значок :-) конечно, это минутная работа, и ваш сайт выглядит более профессионально?
Мэтт Вилко
4
Вы также можете иметь пустой файл favicon.ico. Это остановит запросы (после первого), но не заставит браузер отображать пустой значок, где он обычно отображает любой значок по умолчанию.
mxcl
38
Я должен сказать, что полностью согласен с подразумеваемым вопросом задающего вопрос: с какой целью что-то дополнительное станет обязательным ? и далее, как получается, что мы не можем просто добавить некоторые метаданные к ответу, говорящие «ведите себя точно так же, как если бы вы запросили favicon.ico и получили 404, только на самом деле не делайте запрос и больше не спрашивайте до эта страница меняется ".
Даниэль
36
Это такая боль. У меня есть веб-сервис, который обслуживает только JSON и даже не имеет базовой возможности обслуживать файлы без каких-либо изменений (для начала каждому методу требуется токен аутентификации, чтобы избежать 401/403). Я регистрирую неудачные запросы, чтобы потом анализировать их - журналы постоянно заполняются запросами на значок.
Базовый
3
Это 2015 год. Есть новости об этом?
Джонатан Пратес

Ответы:

575

Сначала я скажу, что наличие значка на веб-странице - это хорошо (обычно).

Однако это не всегда желательно, и иногда разработчикам нужен способ избежать дополнительной нагрузки. Например, IFRAME запрашивает значок, не показывая его. Хуже всего то, что в Chrome и Android IFRAME сгенерирует 3 запроса на значки:

"GET /favicon.ico HTTP/1.1" 404 183
"GET /apple-touch-icon-precomposed.png HTTP/1.1" 404 197
"GET /apple-touch-icon.png HTTP/1.1" 404 189

Следующее использует URI данных и может использоваться, чтобы избежать ложных запросов favicon:

<link rel="shortcut icon" href="data:image/x-icon;," type="image/x-icon">

Для ссылок смотрите здесь:

Ошибка / поведение Chrome, вероятно, будет исправлена ​​в следующих версиях.

Вот сообщение об ошибке для голосования:

ОБНОВЛЕНИЕ 1:

Из комментариев (jpic) похоже, что Firefox> = 25 больше не нравится приведенный выше синтаксис. Я протестировал на Firefox 27, и он не работает, пока он работает на Webkit / Chrome.

Итак, вот новый, который должен охватывать все последние браузеры. Я тестировал Safari, Chrome и Firefox:

<link rel="icon" href="data:;base64,=">

Я исключил имя «ярлыка» из значения атрибута «rel», так как это только для более старых версий IE, а версии IE <8 также не любят dataURI. Не проверено на IE8.

ОБНОВЛЕНИЕ 2:

Если вам нужен документ для проверки на соответствие HTML5, используйте вместо этого:

<link rel="icon" href="data:;base64,iVBORw0KGgo=">
Диего Перини
источник
1
Brilliant. Я должен догадаться, что тот факт, что вы получили так мало голосов, связан только с тем фактом, что с того момента, как был задан вопрос, прошло несколько лет, и у менее умных ответов было больше времени для сбора голосов.
иконоборчество
21
У вашего UPDATE 2 были проблемы с Lollipop ... добавление, <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=">похоже, решило проблему.
Алко
2
Если я правильно понял, я могу открыть data:image/png;base64,iVBORw0KGgo=в браузере, сохранить как favicon.icoaka. пустой файл PNG и сохранить его в корне сайта. Правильно?
Мартин
3
@Alko Этот пустой файл PNG по-прежнему недействителен. Если речь идет только о создании URL-адреса данных, который описывает пустой файл, используйте: <link rel = "icon" href = "data:,">
vog
2
Браузеры, как правило, запрашивают значок избранного, даже если в файле index.html нет ссылок на него, так как же это решение может предотвратить это? В частности, я видел, что Firefox очень агрессивно обращается с запросом, как только вы посещаете домен. Другие браузеры могут сделать это позже, возможно, после того, как индексный файл загрузит заголовок (прокомментируйте кто-нибудь с большим знанием внутренних функций браузеров). Отсутствие favicon имеет потенциальные побочные эффекты, просто Google, или: stackoverflow.com/questions/4269695/…
juanheyns
131

Просто добавьте следующую строку в <head>раздел вашего HTML-файла:

<link rel="icon" href="data:,">

Особенности этого решения:

  • 100% действительный HTML5
  • очень короткий
  • не несет никаких причуд от IE 8 и старше
  • не заставляет браузер интерпретировать текущий HTML-код как favicon (что было бы в случае с href="#")
ВОГ
источник
4
Если вы просто пытаетесь заткнуть chrome devtools в локальном проекте, это, безусловно, самый простой и чистый способ.
Андрей
Пожалуйста, подробно об этом. Нужно ли просто включить это в мой HTML-файл, чтобы остановить запрос favicon?
Аакаш Верма
2
@AakashVerma Да, это все. Больше ничего не нужно. (Если ваш сайт не должен поддерживать Internet Explorer 8 или более поздней версии.) Я соответственно улучшил свой ответ.
ВОГ
@asynts Что вы имеете в виду reserves space?
Мворисек
@Andrew В чем проблема Chrome DevTools с этим решением?
Flinsch
47

Я верю, что видел это (Я не проверял это или использовал это лично хотя):

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

У кого-нибудь был подобный опыт?

РЕДАКТИРОВАТЬ:

Я только что протестировал приведенный выше фрагмент и при принудительном полном обновлении в Fiddler не было замечено ни одного запроса favicon. Я протестировал против IE8 (режим Compat как стандарты IE7) и FF 3.6.

mlhDev
источник
1
мои тесты также показывают, что этот трюк работает. Однако мне нужна hrefссылка на какой-то статический (кэшированный) ресурс, который вы уже загрузили (например, файл CSS или файл сценария) - чтобы гарантировать, что динамическая (не кэшированная) страница не будет запрошена дважды. (Просто чтобы быть в безопасности, так как href="#"технически указывает на текущую веб-страницу).
Мар Эрлигссон
2
Я попробовал в Safari. Запрос favicon снова попадает на страницу хостинга.
Морган Ченг
27
Я бы не советовал, потому что это заставляет браузер (Safari5 / Mac, может быть, и другие тоже) дважды запрашивать веб-страницу с сервера.
Манав
2
@Manav Это больше не относится к Safari6 / Mac.
Марсель
2
БУМ ЭТО! Спасибо: D теперь я не увижу эту досадную ошибку, пока, наконец, не найду эту иконку хе-хе.
Леон Габан
39

Ты не можешь Все, что вы можете сделать, это сделать этот образ как можно меньшего размера и установить некоторые заголовки аннулирования кэша ( Expires, Cache-Control) в будущем. Вот что Yahoo! должен сказать о запросах favicon.ico.

Ionuț G. Stan
источник
7
Он сказал, что у него нет значка. Они не становятся намного меньше, чем это. И нет смысла кэшировать несуществующие файлы.
ИннаМ
16
Если у него нет значка, то он должен сделать его, это было моей точкой зрения. Нет лучшего решения, чем это. Разве это не логично? Если нет возможности остановить запросы, если вы не используете кеширование, что вы делаете?
Ionuț G. Stan
5

Вы можете использовать .htaccess или серверные директивы, чтобы запретить доступ к favicon.ico, но сервер отправит ответ об отказе в доступе в браузер, и это все равно замедлит доступ к странице.

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

Во-первых, предоставьте небольшое изображение favicon.ico, которое может быть пустым, но настолько маленьким, насколько это возможно. Я сделал черно-белый под 200 байтов. Затем, используя директивы .htaccess или server, установите заголовок файла Expires на месяц или два в будущем. Когда тот же пользователь возвращается на ваш сайт, он будет загружен из кэша браузера, и на ваш сайт не будет отправлено ни одного запроса. Не более 404 в журналах сервера тоже.

Если у вас есть контроль над полным сервером Apache или, возможно, виртуальным сервером, вы можете сделать это: -

Если корневым документом сервера является скажем / var / www / html, добавьте это в /etc/httpd/conf/httpd.conf:-

Alias /favicon.ico "/var/www/html/favicon.ico"
<Directory "/var/www/html">
    <Files favicon.ico>
       ExpiresActive On
       ExpiresDefault "access plus 1 month"
    </Files>
</Directory>

Тогда один файл favicon.ico будет работать для всех виртуальных хостинговых сайтов, поскольку вы используете его для псевдонимов. Он будет извлечен из кеша браузера через месяц после посещения пользователями.

Для .htaccess это работает (не проверено мной): -

AddType image/x-icon .ico
ExpiresActive On
ExpiresByType image/x-icon "access plus 1 month"
Anon1
источник
Не забудьте включить модуль: ~ / etc / apache2 # a2enmod expires && service apache2 restart
Sino Boeckmann
4

Очень простое решение - поместить код ниже в ваш .htaccess. У меня была такая же проблема, и это решило мою проблему.

<IfModule mod_alias.c>
    RedirectMatch 403 favicon.ico
</IfModule>

Ссылка: http://perishablepress.com/block-favicon-url-404-requests/

Марсио Маццукато
источник
Ссылка на статью очень хорошая, но я считаю, что синтаксис в ответе неверен.
Эрика Кейн
4

если вы используете nginx 

# skip favicon.ico
#
location = /favicon.ico {
    access_log off;
    return 204;
}
Винсент см
источник
Это не мешает запросу, но мне нравится как альтернатива.
QasimK
Конечно, если вы можете контролировать веб-сервер.
Джбруни
1

В Node.js,

res.writeHead(200, {'Content-Type': 'text/plain', 'Link': 'rel="shortcut icon" href="#"'} );
Висв М
источник
0

По нашему опыту, когда Apache переключился на запрос favicon.ico, мы закомментировали дополнительные заголовки в файле .htaccess.

Например, у нас был установлен заголовок X-XSS-Protection "1; mode = block"

... но мы забыли заранее использовать заголовки a2enmod. Комментирование отправляемых дополнительных заголовков решило проблему favicon.ico.

У нас также было несколько виртуальных хостов, настроенных для разработки, и произошел сбой только с 500 Internal Server Error при использовании http: // localhost и получении /favicon.ico. Если вы запустите «curl -v http: //localhost/favicon.ico » и получите предупреждение о том, что имя хоста отсутствует в кэше преобразователя или что-то в этом роде, у вас могут возникнуть проблемы.

Это может быть так же просто, как не получить (мы попробовали это, и это не сработало, потому что наша основная причина была другой), или поискать директивы в apache2.conf или .htaccess, которые могут вызывать странные сообщения 500 Internal Server Error.

Мы обнаружили, что он потерпел неудачу так быстро, что в журналах ошибок Apache не было ничего полезного, и потратил целое утро на то, чтобы менять мелкие детали тут и там, пока мы не решили проблему установки дополнительных заголовков, когда забыли загрузить mod_headers!

Дж. Деклан Янг
источник
0

Иногда эта ошибка возникает, когда в HTML есть какой-то закомментированный код, а браузер пытается что-то найти. Как и в моем случае, я прокомментировал код для веб-формы в фляге, и я получил это.

Потратив 2 часа, я починил это следующими способами:

1) Я создал новую среду Python, а затем он выдал ошибку в закомментированной строке HTML, до этого мне выдавалась только ошибка 'GET /favicon.ico HTTP / 1.1 "404'

2) Иногда, когда у меня был дублированный код, такой как файл python, существующий с таким же именем, я также видел эту ошибку, попробуйте удалить их тоже

ohsoifelse
источник
-10

Вы могли бы использовать

<link rel="shortcut icon" href="http://localhost/" />

Таким образом, он фактически не будет запрашиваться с сервера.

мистифицировать
источник
1
Похоже, что некоторые браузеры могут выдавать страшные сообщения об ошибках, а также вам придется остерегаться использования этого трюка на страницах, которые могут обслуживаться по HTTPS.
Brighid McDonnell
6
Использование about: blank лучше.
Лука