我正在尝试让 IOS (10.2) 和 safari 上的图标正常工作。当我在网页上单击“添加到桌面”图标时,会显示并添加图标。但是当我尝试创建书签时,我得到的是 1 个字母的占位符图像。据我所知,书签和“添加到桌面”磁贴应使用相同的图标。
我的 head 元素中有这个:
<link rel="apple-touch-icon" sizes="76x76" href="apple-touch-icon-76x76.png?v=asdf">
<link rel="apple-touch-icon" sizes="120x120" href="apple-touch-icon-120x120.png?v=asdf">
<link rel="apple-touch-icon" sizes="152x152" href="apple-touch-icon-152x152.png?v=asdf">
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon-180x180.png?v=asdf">
<link rel="apple-touch-icon" sizes="180x180" href="apple-touch-icon.png?v=r0RW">
<link rel="icon" type="image/png" sizes="32x32" href="/favicon-32x32.png?v=r0RW">
<link rel="icon" type="image/png" sizes="16x16" href="/favicon-16x16.png?v=r0RW">
<link rel="manifest" href="/manifest.json?v=r0RW">
<link rel="mask-icon" href="/safari-pinned-tab.svg?v=r0RWdpQrAk" color="#5bbad5">
<link rel="shortcut icon" href="/favicon.ico?v=r0RW">
<meta name="theme-color" content="#ffffff">
我正在 pythons SimpleHTTPServer 上运行测试,并且对书签和“添加到桌面”的请求都正确通过。
10.0.8.109 - - [11/May/2017 18:01:05] "GET /apple-touch-icon-120x120.png?v=asdf
HTTP/1.1" 200 -
但 safari 中实际上没有显示书签图标..
最佳答案
您应该在浏览器中打开 /apple-touch-icon-120x120.png?v=asdf
,以确保图标有效(确实是图像,确实是 120x120...) .
如果有效,则问题可能来自 iOS Safari。当希望显示已添加书签的站点的图标时,此浏览器有时会很懒。您可以尝试以下两件事:
- 重试“添加到主屏幕”。尽管这听起来很粗糙,但这实际上是一件好事。特别是如果您之前多次访问过自己的网站,但该网站还没有图标。您可以将此视为“ super 图标缓存问题”。
- 尝试使用其他 iOS 设备。
关于ios - Apple ios Safari 书签 favicon 不起作用,添加到桌面有效,我们在Stack Overflow上找到一个类似的问题: https://stackoverflow.com/questions/43920751/