2017-09-22 5 views
1

Je travaille sur un Firefox web-ext. Y at-il un moyen par lequel je peux obtenir le favicon du site/onglet actuel. J'ai parlé this mais je ne pense pas que les travaux %c anymore.This est mon manifest.json (partie):Obtenez le favicon d'une URL et l'afficher (firefox web-ext)

"permissions": [ 
    "storage", 
    "<all_urls>", 
    "tabs", 
    "activeTab" 
], 

"browser_action": { 
    "default_icon": "icons/love.ico", 
    "default_title": "Show URL and Favicon", 
    "default_popup": "popup/addsite.html" 
} 

Le fichier addsite.js ressemble à ceci:

var addnewsite = document.querySelector('.addnewbutton'); 
var siteContainer = document.querySelector('.site-container'); 
addnewsite.addEventListener('click', addNEWsite); 

function onError(error) { 
    console.log('Error: ${error}'); 
}//generic error handler 

function addNEWsite(){ 
    siteurl(); 
    function siteurl(){ 
     browser.tabs.query({ currentWindow: true, active: true }, function (tabs) { 
      addurl(tabs[0].url); 
     }); 
    } 
    function addurl(link){ 
     var urltostore = link; 
     var gettingItem = browser.storage.local.get(urltostore); 
     gettingItem.then((result) => { 
      var objTest = Object.keys(result); 
      if(objTest.length < 1 && urltostore !== ''){ 
       storeurl(urltostore); 
      } 
     }, onError); 
    } 
} 

function storeurl(link){ 
    var storingurl = browser.storage.local.set({link}); 
    storingurl.then(() => { 
     displayurl(link); 
    }, onError); 
} 

function displayurl(link) { 
    var url = document.createElement('div'); 
    var urlDisplay = document.createElement('div'); 
    var urlPara = document.createElement('p'); 
    url.setAttribute('class','url'); 
    urlPara.textContent = link; 
    urlDisplay.appendChild(urlPara); 
    url.appendChild(urlDisplay); 
    siteContainer.appendChild(url); 
} 

Voici un instantané lorsque le bouton à l'intérieur de l'extension est cliqué (picture). Vous pouvez voir que je peux obtenir l'URL en utilisant le code actuel. Mais je veux aussi montrer le favicon de la page à côté de son url (favIconUrl montre l'URL de l'icône, puis-je l'obtenir à partir de là!?, Si oui, comment?). Quelqu'un peut-il m'aider à faire cela?

Répondre

0

Pour ceux qui ont besoin du code pour cela, la voici:

var favicon = document.createElement('img'); 
// get the url of favicon using favIconUrl function 
favicon.src = "https://jsfiddle.net/favicon.ico"; 
document.body.appendChild(favicon); 
// you can also append it to a container if you want to 

Vérifiez la fiddle pour cela.

Pour obtenir l'URL de la favicon, vous pouvez soit ajouter /favicon.ico à la fin ou l'obtenir à partir du favIconUrl.

0

Le favicon d'un site Web peut être trouvé de l'une des deux façons. Dans la section <head> vous pouvez trouver:

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

Lorsque les points d'attribut href le favicon. Si cela manque, alors ce sera toujours /favicon.ico, à la racine du site.

+0

Pouvez-vous s'il vous plaît être plus précis quant à où dois-je le mettre pour que Je peux "appendChild" au div-container requis? – Miraj50

0

Un bon hooray pour https://icons.better-idea.org/ qui ont créé une solution pour le fait que moins de favicon & sont stockés à la racine d'un domaine.

Il est libre, il fonctionne (jusqu'à 100% du temps dans mon cas) et il est aussi simple que possible:

<img src='https://icons.better-idea.org/icon?url=github.com&size=80..120..200' /> 

vous voudrez peut-être mettre en signet le repo github si vous ne « t veulent compter sur un webservice libre qui pourrait arrêter à tout moment (comme il le souligne à juste titre sur le site) https://github.com/mat/besticon

Clap Clap