在Chrome扩展中可靠地获取图标，chrome：// favicon？ [英] Reliably getting favicons in Chrome extensions, chrome://favicon?
问题描述
我在 chrome：// favicon / >谷歌浏览器扩展程序来获取RSS提要的图标。我所做的是获取链接页面的基本路径，并将其附加到 chrome：// favicon / http：//< domainpath> 。
它的工作真的不可靠。很多时候它报告标准的no-favicon-icon，即使页面确实有favicon。关于 chrome：// favicon 机制几乎没有文档，所以很难理解它是如何工作的。它只是一个访问过的链接缓存吗？是否有可能检测是否有图标？
从一些简单的测试中，它只是您访问过的网页的图标缓存。所以如果我订阅dribbble.com的RSS源，它不会在我的扩展中显示一个favicon。然后，如果我访问 chrome：// favicon / http：//dribbble.com/ ，它将不会返回正确的图标。然后，我在另一个选项卡中打开dribbble.com，它在选项卡中显示其图标，然后当我重新加载 chrome：// favicon / http：//dribbble.com/ 它会返回正确的图标。然后我打开我的扩展弹出窗口，它仍然显示标准图标。但是，如果我重新启动Chrome，它会在任何地方都得到正确的图标。
现在只是基于一些基础研究，并没有让我更接近解决方案。所以我的问题是： chrome：// favicon / 是我正在做什么的正确用例。有没有关于它的文档？这是什么预期的行为？
我也看到这个问题，它真的令人讨厌。
据我所知，Chrome访问一个URL（如果有的话，省略URL的#hash部分）后会填充chrome：// favicon / cache。它看起来通常在页面完全加载后有时填充此缓存。如果您在关联页面完全加载之前尝试访问chrome：// favicon / http://yoururl.com ，您将会通常会恢复默认的地球图标。然后刷新页面上显示的图标，然后修复它们。
因此，如果可以，可能只是刷新正在显示的页面在显示给用户之前的图标可能会作为修正。
在我的使用案例中，我实际上打开了我想从中获取网页图标的选项卡。到目前为止，我发现获取它们的最可靠方法大致如下：
chrome.webNavigation.onCompleted.addListener（onCompleted ）;
function onCompleted（details）
{
if（details.frameId> 0）
{
//我们不关心活动的发生在标签
return的子帧内;
chrome.tabs.get（details.tabId，function（tab）{
var url = tab.url？tab.url.replace（/#.*$ /，''）：''; // drop #hash
var favicon;
var delay;
if（tab.favIconUrl&& tab.favIconUrl！= ''
&&&tab.favIconUrl.indexOf（'chrome：// favicon /'）== -1）{
// favicon似乎是一个普通的url
favicon = tab.favIconUrl;
delay = 0;
}
else {
//无法获取favicon作为普通网址，请尝试chrome：// favicon / url
favicon ='chrome：// favicon /'+ url;
delay = 100; //更大的值可能会更可靠
}
setTimeout（function（）{
///设置图标favicon无论它需要在这里设置
console.log（'延迟'，延迟，'tabId'，tab.id，'favicon'，favicon）;
} ，延迟）;
}）;
}
这种方法为新网址返回大约95％的正确图标，使用延迟= 100。如果可以接受它，增加延迟将增加可靠性（我的使用情况为1500毫秒，并且它错过了新网址的时间<1％;当许多选项卡同时打开时，这种可靠性会恶化）。显然，这是一种非常不精确的方式，但它是迄今为止我发现的最好的方法。
另一种可能的方法是将favicon从< href =http://www.google.com/s2/favicons?domain=somedomain.com =noreferrer> http://www.google.com/s2/favicons?domain=somedomain.com 。我不太喜欢这种方法，因为它需要访问外部网络，依赖于无法保证启动的服务，而且本身有点不可靠;我已经看到它不一致地返回www.domain.com URL的globe图标，但返回domain.com的正确图标。
希望这有助于一些方式。
I'm using the chrome://favicon/ in my Google Chrome extension to get the favicon for RSS feeds. What I do is get the base path of linked page, and append it to chrome://favicon/http://<domainpath>.
It's working really unreliably. A lot of the time it's reporting the standard "no-favicon"-icon, even when the page really has a favicon. There is almost 0 documentation regarding the chrome://favicon mechanism, so it's difficult to understand how it actually works. Is it just a cache of links that have been visited? Is it possible to detect if there was an icon or not?
From some simple testing it's just a cache of favicons for pages you have visited. So if I subscribe to dribbble.com's RSS feed, it won't show a favicon in my extension. Then if I visit chrome://favicon/http://dribbble.com/ it won't return right icon. Then I open dribbble.com in another tab, it shows its icon in the tab, then when I reload the chrome://favicon/http://dribbble.com/-tab, it will return the correct favicon. Then I open my extensions popup and it still shows the standard icon. But if I then restart Chrome it will get the correct icon everywhere.
Now that's just from some basic research, and doesn't get me any closer to a solution. So my question is: Is the chrome://favicon/ a correct use-case for what I'm doing. Is there any documentation for it? And what is this its intended behavior?
I've seen this problem as well and it's really obnoxious.
From what I can tell, Chrome populates the chrome://favicon/ cache after you visit a URL (omitting the #hash part of the URL if any). It appears to usually populate this cache sometime after a page is completely loaded. If you try to access chrome://favicon/http://yoururl.com before the associated page is completely loaded you will often get back the default 'globe icon'. Subsequently refreshing the page you're displaying the icon(s) on will then fix them.
So, if you can, possibly just refreshing the page you're displaying the icons on just prior to displaying it to the user may serve as a fix.
In my use case, I am actually opening tabs which I want to obtain the favicons from. So far the most reliable approach I have found to obtain them looks roughly like this:
chrome.webNavigation.onCompleted.addListener(onCompleted);
function onCompleted(details)
{
if (details.frameId > 0)
{
// we don't care about activity occurring within a subframe of a tab
return;
}
chrome.tabs.get(details.tabId, function(tab) {
var url = tab.url ? tab.url.replace(/#.*$/, '') : ''; // drop #hash
var favicon;
var delay;
if (tab.favIconUrl && tab.favIconUrl != ''
&& tab.favIconUrl.indexOf('chrome://favicon/') == -1) {
// favicon appears to be a normal url
favicon = tab.favIconUrl;
delay = 0;
}
else {
// couldn't obtain favicon as a normal url, try chrome://favicon/url
favicon = 'chrome://favicon/' + url;
delay = 100; // larger values will probably be more reliable
}
setTimeout(function() {
/// set favicon wherever it needs to be set here
console.log('delay', delay, 'tabId', tab.id, 'favicon', favicon);
}, delay);
});
}
This approach returns the correct favicon about 95% of the time for new URLs, using delay=100. Increasing the delay if you can accept it will increase the reliability (I'm using 1500ms for my use case and it misses <1% of the time on new URLs; this reliability worsens when many tabs are being opened simultaneously). Obviously this is a pretty imprecise way of making it work but it is the best method I've figured out so far.
Another possible approach is to instead pull favicons from http://www.google.com/s2/favicons?domain=somedomain.com. I don't like this approach very much as it requires accessing the external network, relies on a service that has no guarantee of being up, and is itself somewhat unreliable; I have seen it inconsistently return the "globe" icon for a www.domain.com URL yet return the proper icon for just domain.com.
Hope this helps in some way.
这篇关于在Chrome扩展中可靠地获取图标，chrome：// favicon？的文章就介绍到这了，希望我们推荐的答案对大家有所帮助，也希望大家多多支持IT屋！
