发表新帖
发表新帖

local (file://) website favicon works in Firefox, not in Chrome or Safari- why?

后端 未结
关注
7 1401
-上瘾入骨i
-上瘾入骨i 2020-11-27 18:15

The Question

When my website is local (using the file:// protocol), the favicon doesn\'t show up in Chrome or Safari, but it works in Firefox (all on a

相关标签:
7条回答
  • 夕颜
    2020-11-27 18:23

    Well I have the problem similar with Google Chrome the favicon don't show correctly the problem was the .ico I was using was 16x16 and 32x32 I just used a bigger image and it works for all browsers.

    0 讨论(0)
  • 不要未来只要你来
    2020-11-27 18:25

    You can use Base64 data of an image. Put something like this:

    <link href="data:image/x-icon;base64,AAABAAEAEBAAAAAAAABoBAAAFgAAACgAAAAQAAAAIAAAAAEAIAAAAAAAAAQAAAAAAAAAAAAAAAAAAAAAAAD9/f0F/Pz8DP///wD///8P////Dv///xL///8P////A////wD///8A/v7+Cf///wX///8A////APv7+wr9/f0D+/v7Dv///wb///81+vv8i/v7/Iv3+PqL4+nxi+ru9JHy9Piu5+zzru3w9ZD+/v5x/v7+H////wr///8A9/f3H/7+/g7///8J////HNDX5Pyaq8j/m6zJ/5esy/+QpcX/larK/5uwzv+MoMH/mqrG/5qlv+7Q0Nty/f3+Af///wD///8A/v7+A////wz+/v6b2d/q/4abvf+Emr7/jKHD/5Gnyf+Uqsz/fpW5/4mXuP/U1OL/e3ui+MPE0l7///8A////AP///wD///8P////Xa680/9/lrr/kafJ/5yy0/+WrM7/nbPT/52uyv+ktM7/1NTi/8LC1f+lpr3n////AP///wD///8A////AP7+/mDo7PL/ytPi/5yv0fehsuXuuMvl0Kq81drS2uf8+/z9bff3+SG5uM1r8vL1ff///wD///8A////AP///wr+/v4H/v7+jufq8umIg/Sut7L9YKul/W7PzvlMnZn03Ozq/x/+/v4H////AP///wD///8A////AP///wD///8A5OH/IpuS/pF3cfPploz/hH5y/6F/dP+gl47/gkw++e7Hwv9Fta//XPj4/gf///8A////AP///wD///8A+vn/BoyB/pGlnf5vfHfxy4mA/JlIOf/lmZD+f1lK/89kWPrPmZD+f9zY/yu3sP5ar6j/ZP///wD///8A6uj/GbSt/l6imv9yVkf/1HBm+MJ5eOrlhX/1s2JY+dRpYPfPv7/zb4+F/41WR//Uloz/hI6E/47///8A////AOro/xmnn/9teW3/qH5y/6HKxf9B9/n7Fc3N9VfMyvlQraj6cbWv/1zj4f4h2tf/Lks7/+NmWP+/0s7/OP///wCvqP9kjoT/jo6E/46Sif+I+vn/Bt3a/ypsX/+5////AH90/6Dj4f4h0Mz/OrWv/1yyq/9gkon/iNzY/yv///8A19P/MvLx/g////8A////APX0/wxvYv6119P/MtzY/ytmWP+/oZj/df///wBQQP/dt7D+Wv///wD///8A////AP///wD///8A////AKyk/2makf9+UUL/283J/z/l4/8f1dH/M////wD///8At7D+Wv39/gH///8A////AP///wD///8A////AP///wDa1/8u2tf/LtrX/y719P8M////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A////AP///wD///8A//8AAOAfAADgBwAA4AMAAPABAADwHwAA8d8AAPAfAADonwAA8CEAAOf5AADGvQAA/bcAAP3/AAD//wAA//8AAA==" rel="icon" type="image/x-icon" />

    into the <head> section of an html file.
    Base64 data can be received, for example, by favicon.cc

    0 讨论(0)
  • 情深已故
    2020-11-27 18:25

    Local file:// and chrome:

    For a local favicon in Chrome - according to an old thread found on linux command it should be possible to place a local favicon with the file:// if it's in the your /Downloads/ directory. So I tried it like this:

    <!DOCTYPE html>
<html>
<head>
    <title>Test</title>
    <link rel="shortcut icon" type="image/x-icon" href="file://localhost/Users/dominikangerer/Downloads/favicon.ico">
</head>
<body>
    <h1>Testing</h1>
</body>
</html>

    I don't have a apache or anything running. It's simply the way chrome can access local files using the file://. If I try using the favicon from another part of my filesystem it doesn't seems to work - so maybe that's a solution for chrome.

    enter image description here

    Local file:// and Safari:

    Still looking for a way - above code doesn't work for my up2date safari.

    Interesting topic's:

    • Security in depth loca web pages (Chromium Blog)

    General troubleshooting guide for your favicons:

    Have a look at: https://stackoverflow.com/a/16375622/1581725

    0 讨论(0)
  • 逝去的感伤
    2020-11-27 18:31

    I solved this by renaming favicon.ico as new_name.ico. And it works in Safari and Chrome.

    <head>
    <link rel="icon" type="image/x-icon" href="{{ url_for('static', filename='logo.ico') }}">
</head>
    0 讨论(0)
  • 伪装坚强ぢ
    2020-11-27 18:31

    Works In Chrome All you need is a folder with the icon and the website then the html should look like this (MAKE SURE THE ICON IS NAMED favicon.ico !)

    link rel='shortcut icon' type='image/x-icon' href='C:\Website/favicon.ico

    0 讨论(0)
  • 予麋鹿
    2020-11-27 18:38

    Once I've solved it using two lines of code

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

    and also keep the favicon.ico named exatly this and in the webroot folder, if it helps.

    0 讨论(0)
 看不清?
提交回复
热议问题