为什么 Google 字体不在 Firefox 上缓存？

发布于 2024-10-04 16:11:28 字数 350 浏览 8 评论 0原文

我正在尝试在我的网站上使用嵌入的 Google 字体，并且每次有人访问该网站时，我都包含从 Google 字体 API 下载字体的链接，但我在使用 Firefox 时遇到问题，因为它似乎正在尝试下载每次刷新或单击新链接时的字体。

在所有其他浏览器上，它只下载一次，并像任何其他缓存的东西一样在整个网站上缓存字体。

Google 字体 API 样式表的链接如下：

<link href='http://fonts.googleapis.com/css?family=Droid+Sans&subset=latin' rel='stylesheet' type='text/css'>

原文

I'm trying to use the embedded Google fonts on my website and I have included the link to download the font from Google fonts API every time someone visits the website, but I am having a problem with Firefox because it seems like its trying to download the font every time a refresh or click a new link.

On all the other browsers it only download once and cache the font through out the site like any other cached things.

The link to Google font API stylesheets is as follows:

<link href='http://fonts.googleapis.com/css?family=Droid+Sans&subset=latin' rel='stylesheet' type='text/css'>

分享到QQ

分享到微博

如果你对这篇内容有疑问，欢迎到本站社区发帖提问参与讨论，获取更多帮助，或者扫码二维码加入 Web 技术交流群。

发布评论

需要登录才能够评论，你可以免费注册一个本站的账号。

嘿哥们儿 2024-10-11 16:11:28

我注意到同样的行为；用 JavaScript 加载字体似乎可以解决这个问题。只需在您的情况下将“Ubuntu”替换为“Droid”，然后在标记后插入以下代码块即可：

<script type="text/javascript">
  WebFontConfig = {
    google: { families: [ 'Ubuntu' ] }
  };
  (function() {
    var wf = document.createElement('script');
    wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
        '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
    wf.type = 'text/javascript';
    wf.async = 'true';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(wf, s);
  })();
</script>

更多信息可以在 Google Developers' 字体网站。

I noticed the same behaviour; loading the fonts with JavaScript seems to solve the problem. Just replace 'Ubuntu' with 'Droid' in your case and insert the following block of code after your <head> tag:

<script type="text/javascript">
  WebFontConfig = {
    google: { families: [ 'Ubuntu' ] }
  };
  (function() {
    var wf = document.createElement('script');
    wf.src = ('https:' == document.location.protocol ? 'https' : 'http') +
        '://ajax.googleapis.com/ajax/libs/webfont/1/webfont.js';
    wf.type = 'text/javascript';
    wf.async = 'true';
    var s = document.getElementsByTagName('script')[0];
    s.parentNode.insertBefore(wf, s);
  })();
</script>

More info can be found here on Google Developers' Font site.

回复收藏 0 原文

~没有更多了~