JavaScript
的 URL 获取网站的图标。例如,我有 URL
http://www.bbc.co.uk/
,我想获取
<link rel="icon" .../>
元标记中描述的图标的路径 -
http://www.bbc.co.uk/favicon.ico
。我有很多 URL,因此不应加载每个页面并搜索
link
标签。有什么想法吗?
JS
,但
JS
可能没有必要。
<!-- 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' />
http://query.yahooapis.com/v1/public/yql?q=select%20*%20from%20html%20where%20url%3D“http://bbc.co.uk/”和%20xpath%3D “/html/head/link[@rel%3D'icon']%20|%2 0/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
此查询由
显示 Feed Favicons Greasemonkey 脚本使用。
您可以在 YQL 控制台中编写查询,但需要登录(顺便说一句,使用查询则不需要):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%27快捷方式%20icon%27%5D%20%7C%20/html/head/link%5B@rel%3D%27SHORTCUT%20ICON%27%5D%22
它比
http://www.google.com/s2/favicons?domain=www.domain.com
更好,以防 favicon 存在,但不在 domain.com/favicon.ico 中
起点当然是只查看其中的 rel 标签并获取它,但一路走来,您会发现越来越多的情况必须涵盖。
如果有人会查看此线程并尝试接近 100% 完美,我在这里上传了我的(PHP)代码:
https://plugins.svn.wordpress.org/wp-favicons/trunk/includes/server/类-http.php。这是 (GPL) WordPress 插件的一部分,该插件或多或少地根据当时的请求检索 Favicons,摆脱了标准 Google 插件的限制(如上所述)。该代码找到的图标比 Google 的代码要多得多。但也包括谷歌和其他作为图像提供者,以缩短尝试检索图标的进一步迭代。
当您通读代码时,您可能会看到一些您会遇到的情况,例如Base64 数据 uri、页面重定向到 404 页面或重定向无数次、检索奇怪的 HTTP 状态代码并必须检查每个可能的 HTTP 返回代码的有效性、具有错误 mime 类型的图标本身、客户端刷新标签、根文件夹,html 代码中没有,等等...等等...等等...如果你进入一个目录,你会发现其他类,然后根据它们的 url 存储实际的图标(当然,你需要找出哪些“分支”使用相同的图标,哪些不使用,并找出是否它们属于同一个“所有者”,或者实际上是不同的部分,但在同一域下。
https://favicons.githubusercontent.com/microsoft.com
虽然看起来都不完美。 对于堆栈溢出:
<!DOCTYPE html>
<html>
<body style="background-color:grey;">
<script type="text/javascript">
const KRequestFaviconGitHub = 'https://favicons.githubusercontent.com/';
const KRequestFaviconGoogle = 'https://www.google.com/s2/favicons?domain=';
const KDefaultUrl = KRequestFaviconGoogle;
// We rely on pre-defined hostname configurations
const hostnames = {
"stackoverflow.com": { url:KRequestFaviconGoogle+"stackoverflow.com", invert:0 },
"theregister.co.uk": { url:KRequestFaviconGoogle+"theregister.co.uk", invert:1 },
"github.com": { url:KRequestFaviconGitHub+"github.com", invert:1 },
"android.googlesource.com": { url:KRequestFaviconGoogle+"googlesource.com", invert:0 },
"developer.android.com": { url:KRequestFaviconGitHub+"developer.android.com", invert:0 }
};
document.addEventListener('DOMContentLoaded', function(event) {
addFavicon("stackoverflow.com");
addFavicon("bbc.co.uk");
addFavicon("github.com");
addFavicon("theregister.co.uk");
addFavicon("developer.android.com");
addFavicon("android-doc.github.io");
addFavicon("slions.net");
addFavicon("alternate.de");
addFavicon("amazon.de");
addFavicon("microsoft.com");
addFavicon("apple.com");
addFavicon("googlesource.com");
addFavicon("android.googlesource.com");
addFavicon("firebase.google.com");
addFavicon("play.google.com");
addFavicon("google.com");
addFavicon("team-mediaportal.com");
addFavicon("caseking.de");
addFavicon("developer.mozilla.org");
addFavicon("theguardian.com");
addFavicon("niche-beauty.com");
addFavicon("octobre-editions.com");
addFavicon("dw.com");
addFavicon("douglas.com");
addFavicon("douglas.de");
addFavicon("www.sncf.fr");
addFavicon("paris.fr");
addFavicon("bahn.de");
addFavicon("hopfully.that.domain.does.not.exists.nowaythisisavaliddomain.fart");
});
/**
*
*/
function addFavicon(aDomain)
{
var a = document.createElement("a");
a.href = "http://" + aDomain;
//a.style.display = "block";
var div = document.createElement("div");
div.innerText = aDomain;
div.style.verticalAlign = "middle";
div.style.display = "inline-block";
var img = document.createElement("img");
img.className = "link-favicon";
img.style.width = "16px";
img.style.height = "16px";
img.style.verticalAlign = "middle";
img.style.display = "inline-block";
img.style.marginRight = "4px";
a.prepend(img);
a.appendChild(div);
document.body.appendChild(a);
document.body.appendChild(document.createElement("p"));
const conf = hostnames[aDomain]
if (conf==null)
{
img.src = KDefaultUrl+aDomain;
}
else
{
img.src = conf.url;
img.style.filter = "invert(" + conf.invert + ")";
}
}
</script>
</body>
</html>
https://icons.duckduckgo.com/ip3/www.google.com.ico
https://external-content.duckduckgo.com/ip3/www.google.com.ico