Загрузите favicon.ico с помощью инструментов разработчика Google Chrome

33

Где можно получить значок сайта с помощью инструментов разработчика Google Chrome. У меня есть доступ к ресурсам (HTML, CSS, JS, изображения и т. Д.), Но я не могу найти значок.

Где иконка скрыта в инструментах разработчика Chrome?

google-chrome favicon Randomblue
источник
1
У меня возникла та же проблема с HTML-страницей, затем я понял, что не нужно явно указывать значок. Вместо этого браузер автоматически читал /favicon.ico. Ссылка: mathiasbynens.be/notes/rel-shortcut-icon
kevinarpe

Ответы:

19

Иногда бывает сложно найти ссылку «ярлык» в HTML. Другой подход заключается в создании ярлыка Интернета (т. Е. «Избранное» в IE, или «Закладка») и открытия его с помощью Блокнота:

    [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

IconFile и IconIndex обычно находятся в конце.

Скотт
источник
Как я могу открыть один из моих любимых сайтов бара в текстовом редакторе, как это?
Джоэл Балмер
1
Попробуйте это: запустите «Блокнот», сверните его, перетащите избранное на кнопку задачи «Блокнот» на панели задач (не опускайте ее туда) и дождитесь открытия окна «Блокнот», затем перетащите его в открытое окно и оставьте там.
Скотт
1
Спасибо Скотту, к сожалению, на Mac я использую textedit / xcode / sublime для редактирования кода, и выполнение вашего предложения в основном просто вставляет ссылку на любимый сайт. Надеюсь, есть способ!
Джоэл Балмер
2
Я знаю, что спрашивающий принял этот ответ, но он не отвечает на заданный вопрос, который был явным о "использовании инструментов разработчика Chrome". Это также полезно только в том случае, если ОС пользователя - Windows.
jsejcksn
10

Вы можете нажать Ctrl+, Uчтобы просмотреть исходный код и найти значок в коде ( <link rel="shortcut icon"). Обычно он находится в верхней части исходного файла HTML, поскольку находится внутри <head>.

Для этой страницы она находится в 7-й строке:

<!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
источник
4
Почему это не в «Ресурсы», со всеми другими изображениями?
Randomblue
@randomblue Где это должно быть? под фреймами> superuser.com> Картинки ?
amiregelz
3
Да, или где-то поблизости в панели «Ресурсы».
Randomblue
Это не работает надежно. Существует несколько способов указания значка; <link>элемент только один из них.
me_and
9

Вы можете использовать возможности Google, чтобы сделать это:

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

Замена указанного выше доменного имени приведет к появлению значка для данного домена.

Вы также можете использовать этот вариант:

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

который получит значок для любого URL.

blo0p3r
источник
Это определенно не работает для всех URL. В частности, мне не удалось заставить его работать для любого варианта, который я пробовал на pactcoffee.com .
me_and
@ me_and https://www.google.com/s2/favicons?domain=media.pactcoffee.com/закончил работать. Я предполагаю, что это не сработало на оригинале, так как он получал значок из другого субдомена.
blo0p3r
4

Вот инструмент, который на самом деле является частью Google Chrome (как указано в вопросе) и работает для сайтов, которые требуют входа в систему.

В адресной строке введите chrome://favicon/, а затем URL.

Например, chrome://favicon/https://example.com/private-page.html

Источник

browly
источник
2

Используйте вкладку Chrome Dev Tools Network. Фильтр по favicon Перезагрузите страницу с помощью Shift + F5. Вы получите значок, независимо от того, был ли он загружен по ссылке или из местоположения по умолчанию.

безнадежный
источник
0

Почему бы вам просто не щелкнуть правой кнопкой мыши на странице и не выбрать inspect element? Это дает вам HTML-код страницы, и там указывается значок. Просто нажмите на ссылку.

Пример http://cdn.sstatic.net/superuser/img/favicon.ico

CalvT
источник
1
на страницах, где это явно связано. Если страница не указана, веб-браузер попробует расположение по умолчанию /favicon.ico, которое не будет входить в ресурсы или отображать сетевой трафик в Chrome
frumbert