javascript - 查找网站图标 - 当不在默认位置时

Question

我在我的页面上显示来自其他网站的图标。

大约一半的时间他们在这里:

hostname.com/favicon.ico

但另一半他们不是。对于我自己站点中的示例，我像这样链接到我的 .ico 文件。 FAVICON 只是路径的 PHP 定义。

<link rel="SHORTCUT ICON" href="<?php echo FAVICON ?>" />

如何使用 html 中的链接获取网站图标的 URL？

这是 site也就是说，您可以像这样进行谷歌搜索，在其中输入您需要网站图标的域。

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

这是一种解决方案，但似乎比从路径中读取 html 效率低。

我认为谷歌将“所有”图标缓存为 .png 格式并使它们可搜索 -

根据这个site

Answer 1

使用 Ajax 和代理页面加载页面。对于 Ajax:

// Create a request object:
var rq = new XMLHttpRequest(); // Not IE6-compatible, by the way.

// Set up the request:
rq.open('GET', 'proxy.php?url=' + encodeURIComponent(thePageURL), true);

// Handle when it's loaded:
rq.onreadystatechange = function() {
    if(rq.readyState === 4) {
        // The request is complete:
        if(rq.status < 400) {
            // The HTML is stored in rq.responseText; you could use a regular expression to extract the favicon, like /shortcut icon.+?href="(.+?)"/i.
        } else {
            // There was an error fetching the page; fall back?
        }
    }
};

以及代理页面(您可能想要增加一些安全性):

<?php
echo file_get_contents($_REQUEST['url']);
?>

Google“Ajax”，您会找到很多关于如何做这类事情的信息。

您需要代理页面的原因是浏览器不允许来自 JavaScript 的 Ajax 请求跨域，除非目标允许它，它必须明确地这样做。这是出于安全原因，因为 JavaScript 可能会恶意冒充用户。因此，您可以使用服务器端脚本代理内容并避免此类问题。