材质图标和Roboto未在Safari中加载-仅Safari

Question

如您在屏幕截图中看到的，图标和字体未正确加载。

我们的观察是，这仅在Safari中不起作用。无论我们是在iPhone还是Mac上进行测试。

字体加载如下：

<link href="https://fonts.googleapis.com/css?family=Roboto:300,400,500&display=swap" rel="stylesheet" />
<link href="https://fonts.googleapis.com/icon?family=Material+Icons" rel="stylesheet" />

我们测试过的任何其他浏览器都可以正确显示图标和字体。（iOS上的Google浏览器； Windows上的Chrome）

从我们在Safari调试器中看到的看来，字体文件无法下载。（我不想写这个，但是：有时我观察到它工作了很短的时间，然后停止工作。）

在Chrome中，结果如下所示：

有什么建议？

• 自托管？为什么？

更新2019-11-13：在以下位置找到了更多信息：https : //github.com/doanythingfordethklok/safari-cache-bug

Answer 1

您似乎遇到了您更新帖子时所使用的错误。

您是否可能在初始应用程序加载时多次重定向用户？如果是这样，最安全的选择是在开始任何重定向之前等待实际的用户输入，这也将确保所有内容都已正确加载。

另一种方法是通过（即 jQuery 的）document.ready 函数等待文档准备就绪：

$(document).ready(function() {
    // your code here
});

您可以尝试将代码放在那里，或者等待用户输入，直到启动重定向。我个人对 document.ready 方法没有任何运气，并切换到用户输入方法。