6

我的网站上有以下代码：

<link rel="apple-touch-icon" href="http://website.com/images/apple-touch-icon.png" />

当我在 Firefox 中查看源代码并单击图标显示的 href 属性时（因此它不是 404 错误）。

当代码添加到类似http://website.com/mobile/index.phporhttp://website.com/mobile/page.php的页面并将页面添加到 iPhone 主屏幕时，图标可以正常工作，但是当页面 url 类似http://website.com/page或http://website.com/index图标不显示时。

Safari 选项中提供的“网站调试控制台”中没有出现错误，我已尝试清除缓存和 cookie。

我也使用标签<base href="http://website.com/mobile/" />网站，它同时出现在http://website.com/mobile/index.php和http://website.com/index. 但我看不出这会如何影响它，因为 apple-touch-icon 使用完整的 url。

4

3 回答 3

20

这仅适用于具有有效且受信任的安全证书的 HTTP 或 HTTPS 站点。

如果出现证书错误，iOS 将不会加载图像。暂时信任 Safari 中页面的证书将不信任主屏幕快捷方式的证书。如果您使用的是自签名证书，则必须将不受信任的根证书添加为操作系统级别的受信任证书。

  1. 在 iOS 设备上，导航到包含指向 .crt 文件的链接的页面
  2. 点击链接
  3. 通过所有确认屏幕批准/安装
于 2015-04-04T21:32:36.143 回答
4

尝试使用相对 URL：

<link rel="apple-touch-icon" href="/images/apple-touch-icon.png" />

它应该转到您的基本目录并在/images.

于 2011-07-24T14:39:28.390 回答
0

经过几天的反复试验，我似乎找到了解决方案。

在撰写本文时，本地信任自签名证书似乎不起作用。鉴于 Apple对可信证书的更新要求，看起来他们在加强各方面的安全性方面是认真的。

因此，您可以尝试以下方法：

  1. 首先，请确保您拥有有效的图标。您可以使用realfavicongenerator.net将单个图像渲染为多个格式正确且大小合适的图像，以帮助确保 Safari 等浏览器实际使用它们。

  2. 您需要一个有效/公开信任的 SSL 证书。在我将 apple-touch-icon.png 放入我的谷歌驱动器并链接到图标后，我得出了这个结论。它起作用了！..但是...不是最好的解决方案...我已经尝试了所有方法来使自签名 SSL 证书工作。但事实是，浏览器依靠经过验证的证书颁发机构 (CA) 来确定证书的真实性。所以很可能，最简单的事情就是获得一个受信任的证书。幸运的是，有像Certbot或CloudFlare这样的免费选项来完成这项工作。

查看DigitalOcean 的Ubuntu 指南，了解如何使用 HTTPS 保护 Apache Web 服务器并使用 Certbot 为其生成 SSL 证书。

于 2021-02-28T00:56:47.313 回答