如何检索网站图标？答案

【问题标题】：How to retrieve web site favicons?如何检索网站图标？
【发布时间】：2019-03-06 00:13:13
【问题描述】：

我正在使用 Ruby on Rails v3.0.9，我想检索我为其设置链接的每个网站的 favicon.ico 图像。

也就是说，如果我在我的应用程序中设置了http://www.facebook.com/ URL，我想检索 Facebook 的图标并在我的网页中使用\插入它。当然，我也想为所有其他网站这样做。

如何以“自动”方式从网站检索favicon.ico 图标（“自动”是指在网站中搜索网站图标并获取指向它的链接 -我认为没有，因为并非所有网站都有一个名为“favicon.ico”的网站图标。我想以“自动”的方式识别它）？

P.S.：我想做的是类似于 Facebook 在您的 Facebook 页面中添加链接\URL 时所做的：它识别相关的网站徽标，然后将其附加到链接\URL。

【问题讨论】：

想一想，确定没有版权问题？
@Johnny5 - 我不确定，但我不使用网站图标作为我的网站徽标（我只是将它们插入我的网页中），我认为网站图标是公开的。

标签： ruby-on-rails ruby ruby-on-rails-3 image favicon

【解决方案1】：

http://getfavicon.appspot.com/ 非常适合获取网站图标。只需给它网站的 url，你就会得到 favicon：

http://g.etfv.co/http://www.google.com

【讨论】：

谢谢。这是唯一不假设图标位于“www.rooturl.com/favicon.ico”的答案
由于getfavicon已经关闭，这里有另一种方式：https://www.google.com/s2/favicons?domain=stackoverflow.com

【解决方案2】：

最近我写了一些类似的解决方案。

如果我们想找到favicon url，它不仅可以是.ico文件而且不能在根目录下，我们应该解析目标站点的html。

在 Ruby on Rails 中，我使用 nokogiri gem 进行 html 解析。首先，我们解析itemprop 属性包含image 关键字的所有元标记。在目标站点使用https://schema.org/WebPage 模板的情况下，有必要使用比link 标签更现代的技术。

如果我们找到它，我们可以使用content 属性作为favicon url。但我们应该检查它是否真的存在 URL，以确保确定。

如果我们找不到一些元标签，那么我们搜索标准的link 标签，其中rel 属性包含icon 关键字。这是 W3C 标准情况 (https://www.w3.org/2005/10/howto-favicon)

以及我的解决方案的一些代码：

require 'open-uri'

def site_icon_link site
    icon_link = nil
    url = nil
    doc = Nokogiri::HTML(open(site))
    metas = doc.css("meta[itemprop*=image]")

    if metas.any? 
        url = metas.first.attributes['content'].value
    else 
        links = doc.css("link[rel*=icon]")
        if links.any? 
            url = links.first.attributes['href'].value
        end
    end

    if url =~ URI::regexp
        icon_link = url
    elsif (site + url) =~ URI::regexp
        icon_link = site + url
    end

    icon_link

end

【讨论】：

【解决方案3】：

通过两种方式找到网站图标。首先，有一个“硬编码”的传统名称“http://example.com/favicon.ico”。

其次，HTML 页面可以在其<head> 部分、<link rel="icon"...> 和其他一些部分中定义网站图标。 （您可能想阅读Wikipedia article about favicon）

因此，您的自动机可能会获取给定网站的主页，对其进行解析并检查是否有正确的<link> 标签，然后，作为后备，尝试“硬编码”favicon.ico 名称。

【讨论】：

【解决方案4】：

我想我错过了你的问题......

您想从其他网站获取网站图标并将其设为您的吗？

如果这是您想要的，您可以直接从主页图标获取并将其保存在您的公共文件夹中。

因此：www.facebook.com 图标：www.facebook.com/favicon.ico

拍摄该图像并将名称 favicon 保存在您的公共文件夹中

做好就够了

如果你想要动态，你可以使用 jquery，但如果你想要静态，你可以放置一个图像标签指向：[网站的根 url]/favicon.ico

像这样：<%= image_tag "#{website.url}/favicon.ico" %>

【讨论】：

Nicos Karalis 问题：“您想从另一个站点获取一个网站图标并将其变为您自己的吗？” - 回答：“不，我想参考这些网站图标来构建 HTML 图像标签”。
您的意思是构建马赛克图像吗？
不，我的意思是使用该图标只是为了将其放在网站名称附近。例如（'[fv]' 代表 Facebook 图标）：[fv] Facebook。

【解决方案5】：

使用 javascript (jQuery)，像这样：http://jsfiddle.net/aX8T4/

【讨论】：

能不能用jQuery来实现这些东西？
不幸的是，仅当网站图标位于域根目录中时才有效。不过有些网站会这样做：<link href="images/favicon.ico" rel="icon" type="image/x-icon" />

【解决方案6】：

你不能只使用一个带有 src 属性指向 favicon 的常规 img 标签吗？

<img src="http://www.facebook.com/favicon.icon">

这假设浏览器将 .ico 文件识别为图像。帮助方法可能也适用于此。

【讨论】：

我认为不是，因为并非所有网站都有一个名为“favicon.ico”的网站图标。我想以“自动”的方式认识到这一点。

【解决方案7】：

您可以使用pismo gem 轻松完成。

获取 Facebook 网站图标 url 的快速示例：

Pismo::Document.new('http://www.facebook.com/').favicon

【讨论】：

我想尽可能简单地实现我自己的代码\解决方案。
Pismo 不再维护，也不允许redirect，见github.com/peterc/pismo/issues/15

【解决方案8】：

这是我的 ruby 方法，它将去除 URL 的末尾，附加 favicon，并生成图像标签。

  def favicon_for(url)
    matches = url.match(/[^:\/]\/(.*)/)
    image_tag url.sub(matches[1], '') + '/favicon.ico', {width: '16px', height: '16px'}
  end

【讨论】：

聪明，但网站偏离这种模式很常见，因此无法使用。