Obtenez le favicon de site Web avec JS

Question

Je me demande s'il est possible d'obtenir le favicon d'un site Web par une URL avec JavaScript.

Par exemple, j'ai une http://www.bbc.co.uk/ URL et je voudrais obtenir le chemin d'favicon décrit dans la balise meta <link rel="icon" .../> -. http://www.bbc.co.uk/favicon.ico

J'ai beaucoup URL de sorte que ne devrait pas charger chaque page et rechercher tag link je pense.

Toutes les idées?

Answer 1

Vous pouvez utiliser YQL pour que

http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D"http://bbc.co.uk/"and%20xpath%3D"/html/head/link[@rel%3D'icon']%20|%20/html/head/link[@rel%3D'ICON']%20|%20/html/head/link[@rel%3D'shortcut%20icon']%20|%20/html/head/link[@rel%3D'SHORTCUT%20ICON']"&format=json&callback=grab

Cette requête utilisée par affichage RSS Favicons Greasemonkey script .

Vous pouvez écrire des requêtes dans la console YQL, mais il faut se connecter (BTW, en utilisant des requêtes ne pas):

http://developer.yahoo.com/yql/console/#h=select%20*%20from%20html%20where%20url%3D%22http%3A//bbc.co.uk/%22and%20xpath%3D%22/html/head/link%5B@rel%3D%27icon%27%5D%20%7C%20/html/head/link%5B@rel%3D%27ICON%27%5D%20%7C%20/html/head/link%5B@rel%3D%27shortcut%20icon%27%5D%20%7C%20/html/head/link%5B@rel%3D%27SHORTCUT%20ICON%27%5D%22

Il vaut mieux que http://www.google.com/s2/favicons?domain=www.domain.com , dans le cas où il existe favicon, mais ne se trouve pas dans domain.com/favicon.ico

Answer 2

Voici les 2 options de travail, je l'ai testé plus de 100 urls et a obtenu des résultats différents de chaque option. S'il vous plaît noter, cette solution ne JS, mais JS peut ne pas être nécessaire.

<!-- Free --> 
<img height="16" width="16" src='http://www.google.com/s2/favicons?domain=www.edocuments.co.uk' />
<!-- Paid -->
<img height="16" width="16" src='http://grabicon.com/edocuments.co.uk' />

Answer 3

Tout à coup, je trouve quelque chose appelé Google Shared Stuff qui renvoie l'image avec le favicon site par nom d'hôte:

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

Mais fot site de la BBC, il retourne favicon un peu petite. Comparer:

http://www.google.com/s2/ favicons? domain = www.bbc.co.uk
http://www.bbc.co.uk/favicon.ico

Answer 4

Après des tests 30,000 à 40,000, je remarquai que vous rencontrez vraiment beaucoup de situations différentes qui doivent être travaillé contre.

Le point de départ est quelque part ofcourse seulement regarder la balise rel là-bas et allez chercher, mais le long du chemin, vous trouverez de plus en plus de situations que vous aurez à couvrir.

Dans le cas où quelqu'un se penchera sur ce sujet et tente de se rapprocher de 100% la perfection que j'ai téléchargé mon code (PHP) ici: https://plugins.svn.wordpress.org/wp-favicons/trunk/includes/server/class-http.php . Cela fait partie d'un (GPL) Plugin WordPress qui récupère favicons, plus ou moins sur demande à l'époque, sur les limites de la version standard de Google (comme mentionné ci-dessus). Le code trouve une quantité sensiblement plus d'icônes que le code de Google. Mais inclut également Google et d'autres en tant que fournisseurs d'image à un raccourci d'autres itérations pour essayer de récupérer l'icône.

Lorsque vous lisez le code que vous verrez probablement des situations que vous rencontrerez par exemple données base64 Uris, pages redirigeant vers 404 pages ou de rediriger une fois gazillion, la récupération des codes d'état HTTP bizarre et d'avoir à vérifier chaque code de retour possible HTTP pour valable jusqu'au, les icônes elles-mêmes qui ont un mauvais type MIME, balises de rafraîchissement côté client, icônes dans la dossier racine et aucun dans le code html, etc ... etc ... etc ...

Si vous allez un répertoire que vous trouverez d'autres classes qui sont ensuite ment pour stocker les icônes réelles contre leur url (et bien sûr, vous aurez alors besoin de savoir qui « branches » utilisent la même favicon et qui non, et trouver si elles appartiennent au même « propriétaire » ou sont des pièces très différentes, mais dans le même domaine.

Answer 5

Disclaimer: Je me construit ce service, mais vous pouvez essayer http://grabicon.com . Il est une API très simple pour favicons que poignées de redimensionnement et de reformatage à la volée. Il utilise beaucoup de mise en cache proactive pour la vitesse, aussi bien. Comme la plupart des autres services comme celui-ci, vous pouvez insérer ce directement dans votre code HTML et il fonctionne très bien. Je n'ai pas la documentation en ligne pour l'instant, mais voici quelques exemples en utilisant la destination Web préférée de tout le monde:

Obtenir l'icône au format PNG:

http://grabicon.com/icon?domain=microsoft.com

Taille à 64 pixels carrés:

http://grabicon.com/icon?domain=microsoft.com&size=64

Cette pourchasse l'icône en utilisant les différentes méthodes les gens peuvent les mettre en œuvre, et utilise la version la plus haute résolution disponible, car les fichiers contiennent en fait une Favicon.ico collection d'icônes. Il utilise cette version pour redimensionner à votre convenance, à moins qu'un match parfait est déjà disponible.

Laissez-moi savoir ce que vous en pensez et ce que d'autres fonctionnalités que vous pourriez aimer!

Mise à jour:

Grabicon est maintenant de retour en service, et il ne va nulle part. Il a été construit à l'origine pour un client qui a décidé plus tard de ne pas le soutenir. Mais maintenant il est sous mes soins directs, avec une vitesse beaucoup mieux et la capacité de redimensionnement.