Favicon 未在 Safari 中显示

Question

我已经在互联网上搜索过了，但我仍然不知道为什么 favicon 在 safari 上不会显示，在 chrome 和 FF 上显示正常， 我已经在标题中尝试过这些：

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

或者这个

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

将图标更改为 32 位，或从 safari 库中删除 WebpageIcons.db 等。 我检查浏览器堆栈上的网站，以防是我的缓存..

我还有什么遗漏的吗？请让我知道任何建议，提前谢谢。

Answer 1

Safari 使用“apple-touch-icon”而不仅仅是“icon”。此外，如果您希望所有 Apple 设备都显示该图标，则必须指定该图标。

在此处阅读更多内容https://css-tricks.com/favicon-quiz/

Answer 2

使用 https://favicon.io/ 并使用您的 favicon 图像生成 html 代码片段和文件集。

Answer 3

在我的 Ubuntu 机器上开发 Next.js 项目期间，我遇到了类似的问题，即 favicon 没有出现在 Safari 中。我发现了一个解决这个问题的解决方案，概述了here以供本地开发。

此外，为了确保网站图标在现场环境（例如登台或生产）中正确显示，我必须进行额外的配置。我按照

this

指南中的建议添加了属性 crossorigin="use-credentials"。