Chrome 개발자 도구를 사용하여 favicon.ico 가져 오기

33

Chrome 개발자 도구를 사용하여 웹 사이트의 즐겨 찾기 아이콘을 어디에서 얻을 수 있습니까? 리소스 (html, css, js, images 등)에 액세스 할 수 있지만 즐겨 찾기 아이콘을 찾을 수 없습니다.

Chrome 개발자 도구에서 즐겨 찾기 아이콘이 어디에 숨겨져 있습니까?

google-chrome favicon

— 랜덤 블루
소스

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는 일반적으로 끝에 있습니다.

— 스캇
소스

이처럼 텍스트 편집기에서 좋아하는 바 사이트 중 하나를 어떻게 열 수 있습니까?

— Joel Balmer

1

메모장을 시작하고 최소화 한 다음 즐겨 찾기를 작업 표시 줄의 메모장 작업 단추로 끌어다 놓으십시오 (삭제하지 마십시오). 메모장 창이 다시 열릴 때까지 기다린 다음 열린 창으로 끌어서 놓으십시오.

— Scott

1

고맙게도 스캇, 슬프게도 맥에서는 textedit / xcode / sublime을 사용하여 코드를 편집하고 제안을 수행하면 기본적으로 즐겨 찾는 사이트의 링크를 붙여 넣는 것 같습니다. 잘만되면 방법이 있습니다!

— Joel Balmer

2

질문자가이 답변을 수락했지만 "Chrome 개발 도구 사용"에 대한 명시적인 질문에는 답변하지 않습니다. 이것은 또한 사용자의 OS가 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">

— 아미르 겔츠
소스

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 September

@me_and https://www.google.com/s2/favicons?domain=media.pactcoffee.com/는 결국 작동했습니다. 다른 하위 도메인에서 파비콘을 가져 오기 때문에 원본에서 작동하지 않은 것 같습니다.

— blo0p3r

4

다음은 실제로 Chrome의 일부이며 (질문에서 요청한대로) 로그인이 필요한 사이트에서 작동하는 도구입니다.

주소 표시 줄 chrome://favicon/에을 입력 한 다음 URL을 입력하십시오 .

예를 들어 chrome://favicon/https://example.com/private-page.html

출처

— 외설스러운
소스

2

Chrome 개발자 도구 네트워크 탭을 사용하십시오. favicon으로 필터링 Shift + F5를 사용하여 페이지 새로 고침 링크가 있거나 기본 위치에서로드 된 아이콘에 관계없이 아이콘이 표시됩니다

— 희망이없는
소스

0

페이지를 마우스 오른쪽 버튼으로 클릭하고 inspect element? 그러면 페이지의 html 코드가 제공되고 여기에 favicon이 나열됩니다. 링크를 클릭하십시오.

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

— CalvT
소스

1

명시 적으로 링크 된 페이지에서. 페이지가 않으면 되지 지정, 웹 브라우저의 기본 위치를 시도 할 것이다 /favicon.ico자원 로그인하지 않는, 또는 크롬의 네트워크 트래픽에 표시

— frumbert