Pegue o favicon.ico usando as ferramentas de desenvolvimento do Google Chrome

33

Onde posso pegar o favicon de um site usando as ferramentas de desenvolvimento do Google Chrome. Eu tenho acesso aos recursos (html, css, js, imagens, etc.), mas não consigo encontrar o favicon.

Onde o favicon está oculto nas ferramentas de desenvolvimento do Chrome?

google-chrome favicon Randomblue
fonte
1
Eu tive o mesmo problema em uma página HTML, então percebi que o favicon não precisava ser especificado explicitamente. Em vez disso, o navegador estava lendo magicamente automaticamente /favicon.ico. Re
kevinarpe

Respostas:

19

Às vezes, pode ser um pouco tedioso encontrar o link "ícone de atalho" no HTML. Outra abordagem é criar um atalho da Internet (ou seja, um "Favorito" no IE, também conhecido como "Favorito") e abri-lo no Bloco de Notas:

    [DEFAULT]
    BASEURL=http://superuser.com/questions/532616/grab-favicon-ico-…
    [{000214A0-0000-0000-C000-000000000046}]
    Prop3=19,2
    [InternetShortcut]
    URL=http://superuser.com/questions/532616/grab-favicon-ico-using-google-…
    IDList=
->  IconFile=http://cdn.sstatic.net/superuser/img/favicon.ico
    IconIndex=1

O IconFile e IconIndex geralmente estão no final.

Scott
fonte
Como posso abrir um dos meus sites de barra favoritos em um editor de texto como este?
Joel Balmer
1
Tente o seguinte: inicie o Bloco de notas, minimize-o, arraste o favorito para o botão de tarefa do Bloco de notas na barra de tarefas (não o solte lá) e aguarde a janela do Bloco de notas reabrir, depois arraste para a janela aberta e solte-o lá.
Scott
1
Obrigado Scott, infelizmente no mac eu uso textedit / xcode / sublime para editar o código, e executar sua sugestão basicamente parece apenas colar o link do site favorito. Espero que haja um caminho!
Joel Balmer
2
Eu sei que o autor da pergunta aceitou esta resposta, mas ela não responde à pergunta, que foi explícita sobre "usar as ferramentas de desenvolvimento do Chrome". Isso também é útil apenas no caso de o sistema operacional do usuário ser o Windows.
precisa saber é o seguinte
10

Você pode clicar em Ctrl+ Upara visualizar a fonte e procurar o favicon no código ( <link rel="shortcut icon"). Geralmente está no topo do arquivo de origem HTML, pois está dentro do arquivo <head>.

Para esta página, está na 7ª linha:

<!DOCTYPE html>
<html>

<head>

    <title>Grab favicon.ico using Google Chrome dev tools - Super User</title>
    <link rel="shortcut icon" href="http://cdn.sstatic.net/superuser/img/favicon.ico">
amiregelz
fonte
4
Por que não está em "Recursos", com todas as outras imagens?
Randomblue 11/01
@randomblue Onde deveria estar? em Molduras> superuser.com> Imagens ?
amiregelz
3
Sim ou em algum lugar próximo ao painel "Recursos".
Randomblue 11/01
Isso não funciona de maneira confiável. Existem várias maneiras de especificar um favicon; um <link>elemento é apenas um deles.
me_and
9

Você pode usar o poder do google para fazer isso:

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

Substituir o nome de domínio acima irá pegar o ícone favorito para esse domínio.

Você também pode usar esta variante:

http://www.google.com/s2/favicons?domain_url=http%3A%2F%2Fwww.google.de%2F

que receberá o favicon para qualquer URL.

blo0p3r
fonte
Definitivamente, isso não funciona para todos os URLs. Em particular, não consegui fazê-lo funcionar para nenhuma variante que tentei do pactcoffee.com .
me_and 10/09/18
@me_and https://www.google.com/s2/favicons?domain=media.pactcoffee.com/acabou funcionando. Acho que não funcionou no original, pois estava recebendo o favicon de um subdomínio diferente.
Blo0p3r
4

Aqui está uma ferramenta que realmente faz parte do Google Chrome (conforme solicitado na pergunta) e funciona para sites que exigem login.

Na barra de endereço, insira chrome://favicon/, seguido pelo URL.

Por exemplo, chrome://favicon/https://example.com/private-page.html

Fonte

browly
fonte
2

Use a guia Rede de ferramentas de desenvolvimento do Chrome. Filtrar por favicon Recarregar a página com Shift + F5 Você receberá o ícone independentemente de ter sido carregado com o link ou do local padrão

Sem esperança
fonte
0

Por que você não clica com o botão direito na página e seleciona inspect element? Isso fornece o código html da página e o favicon está listado lá. Basta clicar no link.

Exemplo http://cdn.sstatic.net/superuser/img/favicon.ico

CalvT
fonte
1
nas páginas em que está explicitamente vinculado. Se a página não não especificar, o navegador irá tentar o local padrão /favicon.ico, que não registra nos recursos ou mostrar sobre o tráfego de rede no Chrome
frumbert