Jak zapobiegać żądaniom favicon.ico?

548

Nie mam pliku favicon.ico, ale IE zawsze wysyła żądanie.

Czy można uniemożliwić przeglądarce wysłanie żądania favicon z mojej witryny? Może jakiś META-TAG w nagłówku HTML?

favicon Daniel Silveira
źródło
21
+1 dobre pytanie, ale wydaje się, że najprostszym rozwiązaniem jest dodanie ważnego favikonu :-) na pewno jest to jednominutowa praca, a Twoja strona od razu wygląda bardziej profesjonalnie?
Matt Wilko,
4
Możesz także mieć pusty plik favicon.ico. Spowoduje to zatrzymanie żądań (po pierwszym), ale nie spowoduje, że przeglądarka wyrenderuje pusty favicon, w którym zwykle renderuje niezależnie od domyślnej ikony.
mxcl
38
Muszę powiedzieć, że całkowicie zgadzam się z dorozumianą kwestią pytającego: w jakim celu obowiązkowe byłoby uczynienie czegoś dodatkowego ? a ponadto, dlaczego nie możemy po prostu dodać do odpowiedzi niektórych metadanych, mówiąc: „zachowuj się dokładnie tak, jakbyś poprosił o favicon.ico i otrzymał 404, tylko nie wykonuj tego żądania i nie pytaj ponownie, dopóki ta strona się zmienia ”.
Daniel
36
To taki ból. Mam usługę internetową, która obsługuje tylko JSON i nawet nie ma podstawowej możliwości udostępniania plików bez pewnych zmian (na początek każda metoda wymaga tokena uwierzytelnienia, aby uniknąć 401/403). Rejestruję nieudane żądania, aby móc je później przeanalizować - dzienniki są stale zalewane żądaniami favicon.
Podstawowy
3
Jest 2015. Jakieś wieści na ten temat?
Jonathan Prates

Odpowiedzi:

573

Najpierw powiem, że posiadanie favikonu na stronie internetowej jest dobrą rzeczą (zwykle).

Jednak nie zawsze jest to pożądane i czasami programiści potrzebują sposobu, aby uniknąć dodatkowej ładowności. Na przykład IFRAME zażąda favicon, nie pokazując go. Co najgorsze, w Chrome i Androidzie IFRAME wygeneruje 3 prośby o ulubione:

"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

Poniższe informacje wykorzystują identyfikator URI danych i mogą być użyte w celu uniknięcia fałszywych żądań favicon:

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

Aby zobaczyć odniesienia, zobacz tutaj:

Błąd / zachowanie Chrome prawdopodobnie zostanie naprawiony w nadchodzących wersjach.

Oto zgłoszenie błędu do głosowania:

AKTUALIZACJA 1:

Z komentarzy (jpic) wygląda na to, że Firefox> = 25 już nie lubi powyższej składni. Przetestowałem na Firefox 27 i nie działa, dopóki nadal działa na Webkit / Chrome.

Oto nowy, który powinien obejmować wszystkie najnowsze przeglądarki. Testowałem Safari, Chrome i Firefox:

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

Pominąłem nazwę „skrótu” z wartości atrybutu „rel”, ponieważ dotyczy to tylko starszych IE, a wersje IE <8 również nie lubią dataURI. Nie testowano na IE8.

AKTUALIZACJA 2:

Jeśli potrzebujesz swojego dokumentu do sprawdzenia poprawności w stosunku do HTML5, użyj tego:

<link rel="icon" href="data:;base64,iVBORw0KGgo=">
Diego Perini
źródło
1
Znakomity. Muszę zgadywać, że otrzymaliście tak mało głosów, to tylko fakt, że upłynęło kilka lat od pytania, a mniej sprytne odpowiedzi miały więcej czasu na zebranie głosów.
iconoclast
20
Twoja aktualizacja 2 miała problemy z Lollipop ... dodawanie <link rel="icon" type="image/png" href="data:image/png;base64,iVBORw0KGgo=">wydaje się rozwiązać problem.
Alko
2
Jeśli mam rację, mogę otworzyć data:image/png;base64,iVBORw0KGgo=w przeglądarce i zapisać jako favicon.icoaka. pusty plik PNG i zapisz go w katalogu głównym witryny. Dobrze?
Martin
3
@Alko Ten pusty plik PNG jest nadal nieprawidłowy. Jeśli chodzi tylko o utworzenie adresu URL danych opisującego pusty plik, użyj: <link rel = "icon" href = "data:,">
vog 12.08.16
2
Przeglądarki mają tendencję do żądania favicon, nawet jeśli w pliku index.html nie ma żadnych odniesień, więc jak to rozwiązanie mogłoby temu zapobiec? W szczególności widziałem, jak Firefox bardzo agresywnie prosi o to, gdy tylko odwiedzasz domenę. Inne przeglądarki mogą to zrobić później, być może po załadowaniu pliku indeksu do nagłówka (ktoś z większą wiedzą na temat wewnętrznych przeglądarek powinien komentować). Brak favikonu ma potencjalne skutki uboczne, wystarczy google go lub: stackoverflow.com/questions/4269695/…
juanheyns
131

Wystarczy dodać następujący wiersz do <head>sekcji pliku HTML:

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

Funkcje tego rozwiązania:

  • W 100% poprawny HTML5
  • bardzo krótki
  • nie powoduje żadnych dziwactw z IE 8 i starszych
  • nie powoduje, że przeglądarka interpretuje bieżący kod HTML jako favicon (co byłoby w przypadku href="#")
vog
źródło
4
Jeśli próbujesz zamknąć chrome devtools w lokalnym projekcie, jest to zdecydowanie najłatwiejszy i najczystszy sposób.
Andrew
Rozwiń to. Czy muszę to uwzględnić w pliku HTML, aby zatrzymać żądanie favicon?
Aakash Verma
2
@AakashVerma Tak, to wszystko. Nic więcej nie jest potrzebne. (Chyba że Twoja witryna musi obsługiwać Internet Explorer 8 lub starszy.) Odpowiednio poprawiłem swoją odpowiedź.
vog 22.07.17
@asynts Co masz na myśli reserves space?
mvorisek
@Andrew Jaki problem mają Chrome DevTools z tym rozwiązaniem?
Flinsch
47

Myślę, że to widziałem (Nie przetestowałem go jednak ani nie użyłem osobiście):

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

Czy ktoś miał podobne doświadczenie?

EDYTOWAĆ:

Właśnie przetestowałem powyższy fragment i po wymuszonym pełnym odświeżeniu w Fiddler nie było żadnych żądań ulubionych. Testowałem przeciwko IE8 (tryb Compat jako standardy IE7) i FF 3.6.

mlhDev
źródło
1
moje testy wskazują również, że ta sztuczka działa. Mam jednak hreflink do jakiegoś statycznego (buforowanego) zasobu, który już załadowałeś (np. Plik css lub skrypt) - aby upewnić się, że strona dynamiczna (niebuforowana) nie zostanie dwukrotnie wysłana. (Dla bezpieczeństwa, ponieważ href="#"technicznie wskazuje na bieżącą stronę internetową).
Már Örlygsson,
2
Próbowałem w Safari. Żądanie favicon ponownie trafia na stronę hostingową.
Morgan Cheng
27
Nie zasugerowałbym tego, ponieważ powoduje to, że przeglądarka (Safari5 / Mac, może także inni) żąda dwukrotnie strony internetowej z serwera.
Manav
2
@Manav Tak już nie jest w Safari6 / Mac.
Marcel
2
BOOM THIS! Dzięki: D teraz nie zobaczę tego irytującego błędu, dopóki w końcu nie zacznę robić tej ikony hehe.
Leon Gaban,
39

Nie możesz Wszystko, co możesz zrobić, to uczynić ten obraz tak małym, jak to możliwe i ustawić nagłówki unieważniania pamięci podręcznej ( Expires, Cache-Control) daleko w przyszłości. Oto, co Yahoo! ma do powiedzenia na temat żądań favicon.ico.

Ionuț G. Stan
źródło
7
Powiedział, że nie ma favikonu. Nie stają się znacznie mniejsze. I buforowanie nieistniejących plików nie ma sensu.
innaM
16
Jeśli nie ma favikonu, powinien go stworzyć, o to mi chodziło. Nie ma lepszego rozwiązania niż to. Czy to nie jest logiczne? Jeśli nie ma możliwości zatrzymania żądań, chyba że korzystasz z buforowania, co robisz?
Ionuț G. Stan
5

Możesz użyć .htaccess lub dyrektyw serwera, aby odmówić dostępu do favicon.ico, ale serwer wyśle ​​odpowiedź odmowy dostępu do przeglądarki, a to nadal spowalnia dostęp do strony.

Możesz zatrzymać przeglądanie żądań favicon.ico przez przeglądarkę, gdy użytkownik powróci do Twojej witryny, pozostając w pamięci podręcznej przeglądarki.

Najpierw podaj mały obraz favicon.ico, może być pusty, ale tak mały, jak to możliwe. Zrobiłem czarno-biały poniżej 200 bajtów. Następnie, używając .htaccess lub dyrektyw serwera, ustaw nagłówek pliku Wygasa miesiąc lub dwa w przyszłości. Gdy ten sam użytkownik wróci do Twojej witryny, zostanie ona załadowana z pamięci podręcznej przeglądarki i żadne żądanie nie trafi do Twojej witryny. Nigdy więcej 404 w logach serwera.

Jeśli masz kontrolę nad kompletnym serwerem Apache lub serwerem wirtualnym, możesz to zrobić: -

Jeśli katalog główny serwera to powiedz / var / www / html, dodaj go do /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>

Wtedy jeden favicon.ico będzie działał dla wszystkich wirtualnych hostowanych stron, ponieważ go aliasingujesz. Będzie pobierany z pamięci podręcznej przeglądarki przez miesiąc po wizycie użytkowników.

W przypadku .htaccess jest to zgłaszane do działania (nie sprawdzone przeze mnie): -

AddType image/x-icon .ico
ExpiresActive On
ExpiresByType image/x-icon "access plus 1 month"
Anon1
źródło
Nie zapomnij włączyć modułu: ~ / etc / apache2 # a2enmod wygasa i & service restart apache2
Sino Boeckmann
4

Bardzo prostym rozwiązaniem jest wstawienie poniższego kodu do swojego .htaccess. Miałem ten sam problem i to rozwiązało mój problem.

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

Odniesienie: http://perishablepress.com/block-favicon-url-404-requests/

Marcio Mazzucato
źródło
Artykuł, do którego link jest stąd, jest bardzo dobry, ale uważam, że składnia w odpowiedzi jest niepoprawna.
Erica Kane
4

jeśli używasz nginx 

# skip favicon.ico
#
location = /favicon.ico {
    access_log off;
    return 204;
}
Vincent-cm
źródło
To nie zapobiega prośbie, ale podoba mi się to jako alternatywa.
QasimK
Jasne, jeśli możesz kontrolować serwer WWW.
jbruni
1

W Node.js

res.writeHead(200, {'Content-Type': 'text/plain', 'Link': 'rel="shortcut icon" href="#"'} );
Visv M.
źródło
0

Z naszego doświadczenia wynika, że ​​gdy Apache przewrócił się na prośbę favicon.ico, skomentowaliśmy dodatkowe nagłówki w pliku .htaccess.

Na przykład mieliśmy nagłówek ustawiony na X-XSS-Protection „1; mode = block”

... ale zapomnieliśmy wcześniej o sudo a2enmod. Komentowanie wysyłanych dodatkowych nagłówków rozwiązało nasz problem z favicon.ico.

Mieliśmy także kilka wirtualnych hostów skonfigurowanych do programowania i nie powiodło się tylko z 500 wewnętrznym błędem serwera podczas korzystania z http: // localhost i pobierania /favicon.ico. Jeśli uruchomisz „curl -v http: //localhost/favicon.ico ” i zobaczysz ostrzeżenie, że nazwa hosta nie znajduje się w pamięci podręcznej resolvera lub coś w tym rodzaju, możesz napotkać problemy.

Może to być tak proste, że nie można pobrać (próbowaliśmy tego i nie działało, ponieważ nasza główna przyczyna była inna) lub rozejrzeć się za dyrektywami w apache2.conf lub .htaccess, które mogą powodować dziwne 500 komunikatów o błędach wewnętrznego serwera.

Okazało się, że tak szybko się nie udaje, że w dziennikach błędów Apache nie było nic użytecznego i spędziliśmy cały ranek zmieniając małe rzeczy tu i tam, dopóki nie rozwiązaliśmy problemu ustawiania dodatkowych nagłówków, gdy zapomnieliśmy załadować mod_headers!

J. Declan Young
źródło
0

Czasami ten błąd pojawia się, gdy HTML ma skomentowany kod i przeglądarka próbuje czegoś poszukać. Tak jak w moim przypadku skomentowałem kod formularza internetowego w kolbie i dostawałem to.

Po spędzeniu 2 godzin naprawiłem to w następujący sposób:

1) Utworzyłem nowe środowisko Pythona, a następnie zgłosił błąd w komentarzowym wierszu HTML, wcześniej został mi zgłoszony błąd „GET /favicon.ico HTTP / 1.1” 404 ”

2) Czasami, gdy miałem zduplikowany kod, taki jak plik Pythona o tej samej nazwie, wtedy też widziałem ten błąd, spróbuj je również usunąć

ohsoifelse
źródło
-10

Możesz użyć

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

W ten sposób nie będzie faktycznie wymagane od serwera.

josh
źródło
1
Wygląda na to, że niektóre przeglądarki mogą wyświetlać przerażające komunikaty o błędach - musisz też uważać na tę sztuczkę na stronach, które mogą być wyświetlane przez HTTPS.
Brighid McDonnell,
6
Używanie about: blank jest lepsze.
Łukasz