Question

前几天我犯了一个错误：我使用 @ font-face 发布了我的webapp的新版本，其中包含限量版“Droid Sans”（没有拉丁字符）。字体文件托管在我的服务器上。现在我已经用完整版本更改了字体（我的大部分客户都是西班牙语）。新客户获得完整的字体没有问题，但第一次使用有限字体访问的客户不会获得特殊字符。

我猜旧版字体位于浏览器缓存中，但我无法将其删除。

@font-face {
font-family: 'Droid';
src: url(/files/DroidSans.eot);
src: url(/files/DroidSans.eot?iefix) format('eot'),
     url(/files/DroidSans.woff) format('woff'),
     url(/files/DroidSans.ttf) format('truetype'),
     url(/files/DroidSans.svg#webfontw7zqO19G) format('svg');
font-weight: normal;
font-style: normal;
}

@font-face {
font-family: 'DroidBold';
src: url(/files/DroidSansBold.eot);
src: url(/files/DroidSansBold.eot?iefix) format('eot'),
     url(/files/DroidSansBold.woff) format('woff'),
     url(/files/DroidSansBold.ttf) format('truetype'),
     url(/files/DroidSansBold.svg#webfontSOhoM6aS) format('svg');
font-weight: normal;
font-style: normal;
}

body, a, p, div, span, li, td, th, caption {
  font-family: Droid, Optima, Calibri, Helvetica, sans-serif;
  font-size: 10pt;
  line-height: 14pt;
}

Answer 1

更改字体名称应该可以解决问题，因为名称是浏览器查看字体是缓存还是未缓存的唯一标准。

Answer 2

强制重新加载的最简单方法可能是在字体URL中添加一个无意义的查询字符串（或者更改字体名称，因为@Silver light建议，当然！Duh。没有想到这一点。）

@font-face { font-family:Garamond; src:url(garamond.eot?r=1234567); }

当然，这需要您拥有此信息的资源重新加载。如果它是外部样式表，您可能必须应用相同的技巧来强制刷新：

<link rel="stylesheet" href="styles.css?r=1234567890">

Answer 3

更改css文件中的字体名称和链接。因为如果您为静态文件（etag，缓存时间）配置好服务器，大多数浏览器都不会长时间查询较新版本的文件。

如何从浏览器缓存中删除使用@ font-face下载的字体？

3 个答案: