Як запобігти запитам favicon.ico?


549

У мене немає favicon.ico, але IE завжди робить запит на це.

Чи можна завадити браузеру робити запит на фавікон з мого сайту? Можливо, якийсь META-TAG у заголовку HTML?


21
+1 хороший запитання, але здається, що найпростішим рішенням є лише додати дійсний фавікон :-) напевно, це однохвилинна робота, і ваш сайт відразу виглядає більш професійно?
Метт Вілько

4
Ви також можете мати порожній файл favicon.ico. Це зупинить запити (після першого), але не призведе до того, що веб-переглядач видасть порожній фавікон, де зазвичай виводиться незалежно від значка за замовчуванням.
mxcl

38
Я мушу сказати, що я повністю погоджуюсь із загальною думкою запитувача: з якою метою щось додаткове стане обов'язковим ? і далі, як це, що ми не можемо просто додати деякі метадані у відповідь: "поводься так, як якщо б ти попросив favicon.ico та отримав номер 404, тільки насправді не роби запит і більше не запитай знову, поки ця сторінка змінюється ".
Даніель

36
Це такий біль. У мене є веб-сервіс, який обслуговує лише JSON і навіть не має базової можливості обслуговувати файли без певних змін (для початку, для кожного методу потрібен аутентифікатор, щоб уникнути 401/403). Я реєструю невдалі запити, щоб потім їх проаналізувати - журнали постійно заливаються запитами на фавікон.
Основні

3
Це 2015. Будь-які новини про це?
Джонатан Пратес

Відповіді:


574

Спочатку скажу, що мати фавікон на веб-сторінці - це добре (як правило).

Однак це не завжди бажано, і коли-небудь розробникам потрібен спосіб уникнути зайвого навантаження. Наприклад, 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 даних і їх можна використовувати, щоб уникнути підроблених запитів фавікону:

<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
Блискуча. Я мушу здогадуватися, що ви набрали так мало голосів, це стосується лише того, що минуло кілька років з моменту подання питання, і менш розумні відповіді мали більше часу, щоб зібрати голоси.
іконоборство

20
Ваш ОНОВЛЕННЯ 2 мали проблеми на Lollipop ... додавання, <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=">здається, вирішує проблему.
Алько

2
Якщо я правильно зрозумів, я можу відкрити його data:image/png;base64,iVBORw0KGgo=в браузері, зберегти його як favicon.icoака. порожній файл PNG і зберігайте його в корені веб-сайту. Правильно?
Мартін

3
@Alko Цей порожній файл PNG досі недійсний. Якщо мова йде лише про створення URL-адреси даних, що описує порожній файл, використовуйте: <link rel = "icon" href = "data:,">
vog

2
Браузери, як правило, вимагають фавікону, навіть якщо у файлі index.html немає посилань на нього, то як би це рішення запобігло це? Зокрема, я бачив, як Firefox дуже агресивно ставиться до запиту, як тільки ви відвідуєте домен. Інші браузери можуть зробити це пізніше, можливо, після того, як індексний файл завантажить заголовок (хтось, хто має більше знань про внутрішність браузерів, будь ласка, прокоментуйте). Не маючи фавіконки має потенційні побічні ефекти, тільки Google, або: stackoverflow.com/questions/4269695 / ...
juanheyns

131

Просто додайте наступний рядок до <head>розділу вашого HTML-файлу:

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

Особливості цього рішення:

  • 100% дійсний HTML5
  • дуже короткий
  • не спричиняє жодних химерностей від IE 8 і старших
  • не змушує браузер інтерпретувати поточний HTML-код як favicon (що було б у випадку href="#")

4
Якщо ви просто намагаєтеся закрити хромовані розробники на локальному проекті, це, безумовно, найпростіший і чистий шлях.
Андрій

Просимо розширити це. Мені просто потрібно включити це у свій HTML-файл, щоб зупинити запит на Favicon?
Аакаш Верма

2
@AakashVerma Так, це все. Більше нічого не потрібно. (Якщо ваш сайт не потребує підтримки Internet Explorer 8 або новішої версії.) Я відповідно покращив свою відповідь.
vog

@asynts Що ти маєш на увазі під собою reserves space?
mvorisek

@Andrew Яка проблема у Chrome DevTools із цим рішенням?
Флінш

47

Я вірю, що я це бачив (Я не перевіряв його і не використовував його особисто):

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

Хтось мав подібний досвід?

Редагувати:

Я щойно випробував вищевказаний фрагмент, і при вимушеному повному оновленні у Fiddler жодних запитів на фавікон не було. Я протестував IE8 (режим Compat як IE7 стандартів) та FF 3.6.


1
мої тести також показують, що ця хитрість працює. Однак я маю hrefпосилання на якийсь уже завантажений статичний (кешований) ресурс (наприклад, файл css або скрипт) - щоб переконатися, що динамічна (не кешована) сторінка не надходить двічі. (Просто для безпеки, оскільки href="#"технічно вказує на поточну веб-сторінку).
Már Örlygsson

2
Я спробував у Safari. Запит favicon знову потрапляє на сторінку хостингу.
Морган Ченг

27
Я б не пропонував цього, тому що він змушує браузер (Safari5 / Mac, можливо, і інші) запитувати веб-сторінку з сервера двічі.
Манав

2
@Manav У Safari6 / Mac це вже не так.
Марсель

2
Бум це! Дякую: D зараз я не побачу цієї прикрої помилки, поки нарешті не обійдуся, щоб зробити цю піктограму hehe.
Леон Габан

39

Ви не можете. Все, що ви можете зробити, - зробити це зображення якомога меншим і встановити деякі заголовки недійсності кешу ( Expires, Cache-Control) далеко в майбутньому. Ось що Yahoo! має сказати про favicon.ico запити.


7
Він сказав, що у нього немає фавікону. Вони не набагато менші за це. І не має сенсу кешувати неіснуючі файли.
innaM

16
Якщо у нього немає фавікону, то він повинен його зробити, це було моєю думкою. Немає кращого рішення, ніж це. Хіба це не логічно? Якщо немає можливості зупинити запити, якщо ви не використовуєте кешування, що робити?
Ionuț G. Stan

5

Ви можете використовувати .htaccess або директиви сервера, щоб заборонити доступ до favicon.ico, але сервер надішле веб-переглядачу заборонений доступ до доступу, і це все ще уповільнює доступ до сторінки.

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

По-перше, надайте невелике зображення favicon.ico, воно може бути порожнім, але якомога меншим. Я зробив чорний з білим під 200 байт. Потім, використовуючи директиви .htaccess або сервер, встановіть файл 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"

Не забудьте ввімкнути модуль: ~ / etc / apache2 # a2enmod закінчується та & перезапустити послугу apache2
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

Звичайно, якщо ви можете керувати веб-сервером.
jbruni

1

У Node.js,

res.writeHead(200, {'Content-Type': 'text/plain', 'Link': 'rel="shortcut icon" href="#"'} );

0

З нашого досвіду, коли Apache переходив на запит favicon.ico, ми прокоментували додаткові заголовки у файлі .htaccess.

Наприклад, у нас встановлений заголовок X-XSS-захисту "1; mode = block"

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

У нас також було створено декілька віртуальних хостів для розробки, і лише з помилкою 500 внутрішніх помилок сервера під час використання http: // localhost та отримання /favicon.ico. Якщо ви запустите "curl -v http: //localhost/favicon.ico " і отримаєте попередження про те, що ім'я хоста не міститься в кеш-пам'яті резолюції або щось подібне до цього, ви можете виникнути проблеми.

Це може бути настільки ж просто, як не витягувати (ми це намагалися, і це не спрацювало, оскільки наша першопричина була іншою) або шукати директиви в apache2.conf або .htaccess, які можуть спричиняти дивні 500 повідомлень про помилки внутрішнього сервера.

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


0

Іноді ця помилка виникає, коли в HTML є якийсь коментований код і браузер намагається щось шукати. Як і в моєму випадку, я коментував код для веб-форми в колбі, і я отримував це.

Провівши 2 години, я виправив це такими способами:

1) Я створив нове середовище python, а потім він кинув помилку на коментований рядок HTML, до цього мене лише викинула помилка 'GET /favicon.ico HTTP / 1.1 "404'

2) Іноді, коли у мене був дублікат коду, як-от файл python, існуючий з тим самим іменем, тоді також я бачив цю помилку, спробуйте також видалити їх


-10

Ви можете використовувати

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

Таким чином, його насправді не вимагатимуть із сервера.


1
Схоже, це може призвести до того, що деякі веб-переглядачі можуть видавати страхітливі повідомлення про помилки - також вам доведеться стежити за тим, як використовувати цей трюк на сторінках, які можуть подаватися через HTTPS.
Брігід МакДоннелл

6
Використання about: blank краще.
Лука
Використовуючи наш веб-сайт, ви визнаєте, що прочитали та зрозуміли наші Політику щодо файлів cookie та Політику конфіденційності.
Licensed under cc by-sa 3.0 with attribution required.