我怎样才能得到一个网站的图标？

很简单的问题: 我已经创建了一个小应用程序，它基本上只是一个收藏夹，放在我的系统托盘，这样我就可以打开经常使用的网站/文件夹/文件从同一个地方。从我的系统中获取已知文件类型的默认图标并不十分复杂，但我不知道如何从网站获取图标。(例如，在地址栏中有一个灰色-> 橙色的堆栈图标)

有人知道我该怎么做吗？

262030 次浏览
小开
最佳答案

你可以用几种方法来解决这个问题:

  1. 在域的根目录中查找 favicon.ico

    www.domain.com/favicon.ico

  2. 查找具有 rel="shortcut icon"属性的 <link>标记

    <link rel="shortcut icon" href="/favicon.ico" />

  3. 查找具有 rel="icon"属性的 <link>标记

    <link rel="icon" href="/favicon.png" />

后两者通常会产生更高质量的图像。

只是为了覆盖所有的基础，有一些特定设备的图标文件可能会产生更高质量的图像，因为这些设备通常在设备上有比浏览器所需要的更大的图标:

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

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

要下载图标而不管图标是什么，你可以使用像 http://www.google.com/s2/favicons这样的工具，它可以完成所有繁重的工作:

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


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

首先要查找站点根目录中的/Favicon.ico; 类似于 WebClient。DownloadFile ()应该可以。但是，您也可以在元数据中设置图标-对于 SO，这是:

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

并且注意可能有其他的图标可供选择; “触摸”图标往往更大更高的分辨率，例如:

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

因此，您可以在 HTML 敏捷包或 XmlDocument (如果是 xhtml)中解析它，并使用 WebClient.DownloadFile ()

下面是我通过敏捷包获得的一些代码:

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

注意，图标是他们的，不是你的。

小开

您可以从网站的 HTML 获得图标的 URL。

下面是 favicon元素:

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

这里应该使用正则表达式。如果没有找到标记，请在站点根目录中查找 favicon.ico。如果没有发现，该网站没有一个收藏夹。

小开 
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");
小开

2020年更新

以下是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' />
小开

这是一个晚期的答案，但是为了完整性: 它很难获得甚至接近90% 的所有收藏夹。

不久前我写了 一个 WordPress 插件，它试图接近100% 。

事情是这样的:

  1. 它首先搜索现有的收藏夹，如谷歌收藏夹和 GetFavicon 收藏夹的收藏夹。

  2. 如果它们都没有返回图标，插件就会尝试获取图标本身。这涉及到遍历域中的几个页面。

  3. 然后插件检查物理图像文件，因为在一些服务器上，返回的文件包含不正确的 mime 类型。

代码仍然不完美，因为在细节上你会发现许多奇怪的情况: 人们有错误的编码路径，例如 img/favicon.ico，其中 img不在根目录中，HTML 输出中的重复头文件，不同的头和身体的服务器响应等等。

抓取部分 在这里的核心，这样您就可以对它进行反向工程，但是要注意，应该进行响应验证(检查图像文件类型、 mime 等)。

小开

你可以通过3个步骤来完成:

    1.只要打开网站，右键单击并选择 “查看来源”打开该网站的 HTML 代码。然后在文本编辑器中搜索 “图标”-它会引导你找到一些看起来像

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

    获取 href中的字符串并将其附加到网站的基本 URL (假设它是 "http://WEBSITE/") ，因此它看起来像

    http://WEBSITE/SOMERELATIVEPATH/favicon.ico

    这是到达图标的绝对路径。如果您没有以这种方式找到它，它也可以在根目录中，在这种情况下，URL 是 http://WEBSITE/favicon.ico。

    2. 将确定的 URL 插入到以下代码的 Href参数中: 
    <html>
<head>
<title>Capture Favicon</title>
</head>
<body>
<a href='http://WEBSITE/SOMERELATIVEPATH/favicon.ico' alt="Favicon"/>Favicon</a>
</body>
</html>
    3.将这个 HTML 代码保存在本地(例如在桌面上)为 GetFavicon.html，然后双击它打开它。它将只显示一个名为 收藏夹的链接。右键单击这个链接并选择 “将目标保存为...”保存在您的本地电脑的收藏夹-你就完成了！
小开

你可以使用 走吧:

要检索一个图标，你可以热链接它在... ... http://g.etfv.co/[URL]

此页的示例: http://g.etfv.co/https://stackoverflow.com/questions/5119041/how-can-i-get-a-web-sites-favicon

下载内容，开始吧！

编辑:

Getfv.co 和 fvicon.com 看起来已经死了。如果你想要的话，我找到了一个非免费的替代品: Grabicon.com。

小开

SHGetFileInfo(检查 Pinvoke.net的签名)允许检索小图标或大图标，就像处理文件/文件夹/Shell 项一样。

小开

您可以使用 Google S2转换器。

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

资料来源: http://www.labnol.org/internet/get-favicon-image-of-websites-with-google/4404/

小开

Http://realfavicongenerator.net/favicon_checker?site=http://stackoverflow.com 给出了图标分析，说明图标的大小。您可以处理页面信息以查看哪个是质量最好的图标，并将其文件名附加到 URL 以获取它。

小开

最小化每个页面所需的请求数是一个很好的实践。 因此，如果您需要几个图标，yandex 可以在一个查询中完成一个图标精灵。 这里有一个例子 Http://favicon.yandex.net/favicon/google.com/stackoverflow.com/yandex.net/

小开

使用 jquery

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

2020年，使用 CLI 提供的 duckduckgo.com 服务

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

例子

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

有时，我们不能得到的图标图像与目的的解决方案，因为一些网站使用。Png 或其他图像扩展名。这是可行的解决方案。

  1. 用 火狐浏览器打开你的网站。
  2. 右键单击网站并从列表中单击 “查看页面信息”选项。
  3. 它将打开一个对话框并单击 “媒体”选项卡。
  4. 在这个标签，你会看到所有的图片，包括图标。
  5. 选择 Favicon.ico 图像或单击图像以查看哪个图像被用作图标。一些网站使用。还有 png 图像。
  6. 然后点击 “另存为”按钮，你就可以开始了。

谢谢！

小开

这个问题是第一个谷歌搜索结果，我得到的时候，我一直在搜索网站的图标 API。所以我觉得以后还是会有帮助的。

Https://icon.horse/icon/[ url.hostname ] 会给你一个更好的站点图标。

Https://icon.horse/icon/stackoverflow.com


提交答案