Comment puis-je obtenir le favicon d'un site Web?

115

Question assez simple: j'ai créé une petite application qui est essentiellement juste un favori qui se trouve dans ma barre d'état système afin que je puisse ouvrir des sites / dossiers / fichiers souvent utilisés au même endroit. Obtenir les icônes par défaut de mon système pour les types de fichiers connus n'est pas très compliqué, mais je ne sais pas comment obtenir le favicon d'un site Web. (SO a l'icône de pile grise-> orange dans la barre d'adresse par exemple)

Quelqu'un sait-il comment je pourrais y arriver?

c# .net-4.0 favicon

— Steven Evers
source

1

Je ne sais pas à quel point il serait facile (ou possible) d'automatiser le chargement / l'analyse de cette page, mais elle semble avoir tout: Favicon-Checker . À tout le moins, vous pouvez l'utiliser comme référence / vérification.

— Kevin Fegan

Vous pouvez simplement utiliser l' API Statvoo Favicon , ce serait assez rapide et indolore.

— AO_

Favicon Kit vous permet d'obtenir et d'intégrer des favicons comme des images régulières, dans des tailles beaucoup plus grandes que 16 pixels , si disponibles. (Divulgation: je suis l'auteur)

— AndreasPizsa

235

Vous voudrez vous attaquer à cela de plusieurs façons:

Recherchez le favicon.icoà la racine du domaine

www.domain.com/favicon.ico
Recherchez une <link>balise avec l' rel="shortcut icon"attribut

<link rel="shortcut icon" href="https://stackoverflow.com/favicon.ico" />
Recherchez une <link>balise avec l' rel="icon"attribut

<link rel="icon" href="https://stackoverflow.com/favicon.png" />

Les deux derniers produiront généralement une image de meilleure qualité.

Juste pour couvrir toutes les bases, il existe des fichiers d'icônes spécifiques à un appareil qui peuvent produire des images de meilleure qualité, car ces appareils ont généralement des icônes plus grandes sur l'appareil qu'un navigateur aurait besoin:

<link rel="apple-touch-icon" href="images/touch.png" />

<link rel="apple-touch-icon-precomposed" href="images/touch.png" />

Et pour télécharger l'icône sans vous soucier de ce qu'est l'icône, vous pouvez utiliser un utilitaire comme http://www.google.com/s2/favicons qui fera tout le travail:

var client = new System.Net.WebClient();

client.DownloadFile(
    @"http://www.google.com/s2/favicons?domain=stackoverflow.com",
    "stackoverflow.com.ico");

— chasseur
source

1

GetFavIcon fonctionne-t-il toujours? quand j'exécute votre exemple, j'obtiens une erreur 400

— Julien

17

ressemble à Google a un service similaire maintenant: google.com/s2/favicons?domain_url=stackoverflow.com

— chasseur

20

si quelqu'un veut une alternative à Google, DuckDuckGo a une autre solution: icons.duckduckgo.com/ip2/www.stackoverflow.com.ico

— Jose Serodio

1

@hunter google.com/s2/faviconsc'est une icône avec 16x16 c'est une icône terrible savez-vous où prendre une icône plus grande?

— nideba

1

@JoseSerodio - Eh bien ... c'était la première chose que j'ai essayée, mais pour le domaine que je vérifiais, je viens d'obtenir une image "sombre / terne" d'une flèche pointant vers la droite (supérieure à) à l'intérieur d'un cercle à l'intérieur d'un carré . Cela ressemblait à ceci , mais j'ai vérifié pour m'assurer que "domain.com.ico" était correctement orthographié. Maintenant, par les merveilles d'Internet, cela fonctionne correctement ... allez comprendre =) donc, Nevermind.

— Kevin Fegan

19

Mise à jour 2020

Voici trois services que vous pouvez utiliser à partir de 2020

<img height="16" width="16" src='https://icons.duckduckgo.com/ip3/www.google.com.ico' />

<img height="16" width="16" src='http://www.google.com/s2/favicons?domain=www.google.com' />

<img height="16" width="16" src='https://api.statvoo.com/favicon/?url=google.com' />

— Blowsie
source

4

grabicon.com est maintenant un service payant à partir de 9 $ / mois

— janot

1

Un autre: favicon.allesedv.com <img width = "144" height = "144" src = "// f3.allesedv.com/144/www.stackoverflow.com" />

— Martin Seitl

Ce service ne fonctionne plus, vous pouvez utiliser api.statvoo.com/favicon/?url=stackoverflow.com . Je l'utilise depuis quelques années et cela ne m'a jamais déçu.

— AO_

Merci @AO_, j'utilise réellement duckduckgo ces jours-ci, j'ai mis à jour ma réponse

— Blowsie le

1

@saintvixalien Je pense que cela a récemment changé pour les personnes qui ne s'initialisent pas avec une clé API, car les serveurs se faisaient pilonner;) J'utilise le service principal avec une clé API et j'obtiens des réponses directement sans le wrapper. J'ai fait un test sans clé API et il redirige vers le service de Google comme vous l'avez dit ..

— AO_

11

Vous pouvez utiliser Google S2 Converter.

http://www.google.com/s2/favicons?domain=google.com

Source: http://www.labnol.org/internet/get-favicon-image-of-websites-with-google/4404/

— raminjacobson
source

6

La première chose à rechercher est /favicon.ico dans la racine du site; quelque chose comme WebClient.DownloadFile () devrait fonctionner correctement. Cependant, vous pouvez également définir l'icône dans les métadonnées - pour SO, c'est:

<link rel="shortcut icon"
   href="http://sstatic.net/stackoverflow/img/favicon.ico">

et notez que des icônes alternatives peuvent être disponibles; celui "tactile" a tendance à être plus gros et plus haute résolution, par exemple:

<link rel="apple-touch-icon"
   href="http://sstatic.net/stackoverflow/img/apple-touch-icon.png">

vous devez donc analyser cela dans le HTML Agility Pack ou XmlDocument (si xhtml) et utiliser WebClient.DownloadFile ()

Voici un code que j'ai utilisé pour obtenir cela via le pack d'agilité:

var favicon = "/favicon.ico";
var el=root.SelectSingleNode("/html/head/link[@rel='shortcut icon' and @href]");
if (el != null) favicon = el.Attributes["href"].Value;

Notez que l'icône est la leur, pas la vôtre.

— Marc Gravell
source

1

Merci Marc. J'apprécie l'exemple. Avec les images, je n'ai pas l'intention de les modifier ou de les utiliser pour autre chose que des icônes dans le menu contextuel à côté de l'étiquette du raccourci.

— Steven Evers

4

Il est recommandé de minimiser le nombre de requêtes dont chaque page a besoin. Donc, si vous avez besoin de plusieurs icônes, yandex peut créer un sprite de favicons en une seule requête. Voici un exemple http://favicon.yandex.net/favicon/google.com/stackoverflow.com/yandex.net/

— Doroshko
source

3

Vous pouvez obtenir l'URL du favicon à partir du HTML du site Web.

Voici la balise favicon:

<link rel="icon" type="image/png" href="/someimage.png" />

Vous devez utiliser une expression régulière ici. Si aucune balise trouvée, recherchez "favicon.ico" dans le répertoire racine du site. Si rien n'est trouvé, le site n'a pas de favicon.

— OOO '' MMM ''
source

2

Vous pouvez le faire sans programmation . Ouvrez simplement le site Web, cliquez avec le bouton droit de la souris et sélectionnez "Afficher la source" pour ouvrir le code HTML de ce site. Ensuite, dans l'éditeur de texte, recherchez "favicon" - il vous dirigera vers quelque chose qui ressemble à

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

prenez la chaîne hrefet ajoutez-la à l'URL de base du site Web (supposons que ce soit le cas "http://WEBSITE/"), donc cela ressemble à

http://WEBSITE/SOMERELATIVEPATH/favicon.ico

qui est le chemin absolu vers le favicon. Si vous ne l'avez pas trouvé de cette façon, il peut l'être également à la racine, auquel cas l'URL est http://WEBSITE/favicon.ico.

Prenez l'URL que vous avez déterminée et insérez-la dans le code suivant:

<html>
  <head>
   <title>Capture Favicon</title>   
  </head>
  <body>
    <a href='http://WEBSITE/SOMERELATIVEPATH/favicon.ico' alt="Favicon"/>Favicon</a> 
  </body>
</html>

Enregistrez ce code HTML localement (par exemple sur votre bureau) sous GetFavicon.htmlet double-cliquez dessus pour l'ouvrir. Il affichera uniquement un lien nommé Favicon . Faites un clic droit sur ce lien et sélectionnez "Enregistrer la cible sous ..." pour enregistrer le Favicon sur votre PC local - et vous avez terminé!

— Mat
source

1

        HttpWebRequest w = (HttpWebRequest)HttpWebRequest.Create("http://stackoverflow.com/favicon.ico");

        w.AllowAutoRedirect = true;

        HttpWebResponse r = (HttpWebResponse)w.GetResponse();

        System.Drawing.Image ico;
        using (Stream s = r.GetResponseStream())
        {
            ico = System.Drawing.Image.FromStream(s);
        }

        ico.Save("favicon.ico");

— pmcilreavy
source

1

C'est une réponse tardive, mais par souci d'exhaustivité: il est assez difficile d'obtenir même près de 90% de la récupération de toutes les favicons.

Il y a quelque temps, j'ai écrit un plugin WordPress: http://wordpress.org/extend/plugins/wp-favicons/ qui tente de se rapprocher.

une. il commence par regarder les référentiels favicon tels que google favicons, getfavicons etc ...

b. si aucun d'eux ne renvoie d'icône (je vérifie cela en faisant correspondre l'icône par défaut qu'ils renvoient) je commence par essayer d'obtenir l'icône moi-même

c. cela implique de parcourir les pages mais aussi de vérifier les redirections avec NO autoredirect ainsi que de traverser les 404 car également sur les 404 une icône pourrait être présente. Au final, cela signifie que vous devrez analyser également les redirections dans l'en-tête html ainsi que les redirections javascript pour vous rapprocher de 100%

ré. après cela, je fais quelques inspections sur le fichier image physique, car aussi parfois sur certains serveurs (j'ai testé plus de 300 000), les fichiers sont retournés avec le type mime incorrect, etc.

Le code n'est toujours pas parfait car dans les détails ça devient fou, vous trouverez beaucoup de situations bizarres: les gens ont des chemins mal codés (img / favicon.ico où img n'est PAS à la racine), des en-têtes en double dans la sortie html, différentes réponses du serveur d'une tête et d'un corps etc ...

le noyau de la partie de récupération est ici: http://plugins.svn.wordpress.org/wp-favicons/trunk/includes/server/class-http.php afin que vous puissiez faire de l'ingénierie inverse, mais sachez que la validation de la réponse doit vraiment être fait (vérification du type de fichier d'image, mime etc.)

— Edelwater
source

1

J'ai trouvé que le 'SHGetFileInfo' (Vérifiez 'www.pinvoke.net' pour la signature) vous permet de récupérer une petite ou une grande icône, comme si vous traitez avec un fichier / dossier / élément Shell.

Jens;)

— Jens
source

0

http://realfavicongenerator.net/favicon_checker?site=http://stackoverflow.com vous donne une analyse de favicon indiquant quelles favicons sont présentes dans quelle taille. Vous pouvez traiter les informations de la page pour voir quel est le favicon de la meilleure qualité et ajouter son nom de fichier à l'URL pour l'obtenir.

— robotik
source

0

Vous pouvez utiliser Getfv.co :

Pour récupérer un favicon, vous pouvez le lier à chaud sur ... http://g.etfv.co/[URL]

Exemple pour cette page: http://g.etfv.co//programming/5119041/how-can-i-get-a-web-sites-favicon

Téléchargez du contenu et c'est parti!

Éditer :

Getfv.co et fvicon.com semblent morts. Si vous voulez, j'ai trouvé une alternative non gratuite: grabicon.com .

— aloisdg passe à codidact.com
source

1

Lien mort, erreur: introuvable

— tttony

@tttony En effet. fvicon.com a l'air mort aussi. Je modifierai mon commentaire avec du contenu payant. si vous trouvez un lien gratuit fonctionnel, partagez-le!

— aloisdg passe à codidact.com

0

Utilisation de jquery

var favicon = $("link[rel='shortcut icon']").attr("href") ||
              $("link[rel='icon']").attr("href") || "";

— VP
source

0

En 2020, en utilisant le service duckduckgo.com de la CLI

curl -v https://icons.duckduckgo.com/ip2/<website>.ico > favicon.ico

Exemple

curl -v https://icons.duckduckgo.com/ip2/www.cdc.gov.ico > favicon.ico

— Alex Nolasco
source