我正在尝试创建一个离线 HTML5 测试应用程序,并同时使用新的 google fonts api。有谁知道如何缓存远程字体?简单地将 api 调用放在缓存清单中是行不通的,我认为这是因为 api 实际上加载了其他文件(ttf、eot 等)。
如果可以离线使用字体 api,有什么想法吗?
作为参考,这是我正在打的电话:
http://fonts.googleapis.com/css?family=IM+Fell+English|Molengo|Reenie+Beanie
如果将该 URL 粘贴到浏览器地址栏中,您将看到 CSS 链接到的文件:
http://themes.googleusercontent.com/font?kit=txVk61PTIsDrQQj2fK-76Q
http://themes.googleusercontent.com/font?kit=ljpKc6CdXusL1cnGUSamX_cCQibwlboQP4eCflnqtq0
http://themes.googleusercontent.com/font?kit=xwIisCqGFi8pff-oa9uSVOj-KzHqS7w8OFmqoAXdQwE
Robertc 的方法是解决方案......
即,将 google 提供的链接粘贴到您的浏览器中,然后将引用的任何文件添加到您的清单中。
就我而言,我引用了
<link href='http://fonts.googleapis.com/css?family=Patua+One' rel='stylesheet' type='text/css'>
它仅包含以下样式定义
@font-face {
font-family: 'Patua One';
font-style: normal;
font-weight: 400;
src: local('Patua One'), local('PatuaOne-Regular'), url('http://themes.googleusercontent.com/static/fonts/patuaone/v3/yAXhog6uK3bd3OwBILv_SD8E0i7KZn-EPnyo3HZu7kw.woff') format('woff');
}
因此,要让字体在缓存(离线或不离线)时正常工作,您必须将“src”中引用的 URL 添加到清单中。