我有以下代码在我的网站:
<link rel="apple-touch-icon" href="http://website.com/images/apple-touch-icon.png" />
当我在Firefox中查看源代码并单击href属性时，图标显示(因此它不是404错误)。
当代码被添加到一个页面，如http://website.com/mobile/index.php或http://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上。但我看不出这有什么影响，因为苹果触摸图标使用了一个完整的url。
此操作仅适用于具有有效且受信任的安全证书的HTTP或HTTPS站点。
如果有证书错误，iOS将不会加载图像。暂时信任Safari中页面的证书将不会信任主屏幕快捷方式的证书。如果您使用的是自签名证书，则必须将不受信任的根证书添加为操作系统级别的受信任证书。
- 在iOS设备上，导航到一个带有。crt文件链接的页面
- 点击链接
- 通过所有确认屏幕批准/安装
尝试使用相对URL:
<link rel="apple-touch-icon" href="/images/apple-touch-icon.png" />
它应该进入你的基本目录，在/images中找到图标。
经过几天的反复试验，我似乎找到了一个解决办法。
在撰写本文时，本地信任自签名证书似乎不起作用。考虑到苹果对可信证书的最新要求，看起来他们在加强各方面的安全性方面是认真的。
你可以这样做:
-
首先，确保你有有效的图标。你可以使用realfavicongenerator.net将一个图像渲染成多个正确格式化和大小的图像，以帮助确保像Safari这样的浏览器实际使用它们。
-
您需要一个有效的/公开信任的SSL证书。我是在把apple-touch-icon.png文件放入我的google drive并链接到该图标后得出这个结论的。它工作!…但是…这不是最好的解决方案……为了使自签名SSL证书工作，我已经尝试了所有方法。但事实是，浏览器依赖于经过验证的证书颁发机构(CA)来确定证书的真实性。因此，最简单的方法很可能是获取受信任的证书。幸运的是，有像Certbot或CloudFlare这样的免费选择来完成这项工作。
看看DigitalOcean关于如何保护Apache web服务器的Ubuntu指南使用Certbot为其生成SSL证书