我需要在内部网应用程序上使用一些谷歌字体。客户端可能有也可能没有互联网连接。阅读许可条款,这似乎是法律允许的。
当前回答
编辑:正如luckyrumo指出的那样,字体被放弃了,取而代之的是:https://github.com/fontsource/fontsource
如果您正在使用Webpack,您可能会对这个项目感兴趣:https://github.com/KyleAMathews/typefaces
例如,你想使用Roboto字体:
npm install typeface-roboto --save
然后把它导入你的应用的入口点(主js文件):
import 'typeface-roboto'
其他回答
我有一个类似于@neverpanic的PHP脚本,自动从谷歌下载CSS和字体(暗示和未暗示)。然后,它根据用户代理从您自己的服务器提供正确的CSS和字体。它有自己的缓存,所以用户代理的字体和CSS只会被下载一次。
它还处于早期阶段,但可以在这里找到:DaAwesomeP / php-offline-fonts
很好的解决方案是google-webfonts-helper .
它允许你选择多个字体变体,这节省了很多时间。
我在一个grunt任务中使用了grunt-local-googlefont。
module.exports = function(grunt) {
grunt.initConfig({
pkg: grunt.file.readJSON('package.json'),
"local-googlefont" : {
"opensans" : {
"options" : {
"family" : "Open Sans",
"sizes" : [
300,
400,
600
],
"userAgents" : [
"Mozilla/4.0 (compatible; MSIE 8.0; Windows NT 6.0)", //download eot
"Mozilla/5.0 (Linux; U; Android 4.1.2; nl-nl; GT-I9300 Build/JZO54K) AppleWebKit/534.30 (KHTML, like Gecko) Version/4.0 Mobile Safari/534.30", //download ttf
"Mozilla/5.0 (Macintosh; Intel Mac OS X 10_9_2) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/35.0.1944.0 Safari/537.36" //download woff and woff2
],
"cssDestination" : "build/fonts/css",
"fontDestination" : "build/fonts",
"styleSheetExtension" : "css",
"fontDestinationCssPrefix" : "fonts"
}
}
}
});
grunt.loadNpmTasks('grunt-local-googlefont');
};
然后,要检索它们:
grunt local-googlefont:opensans
注意,我使用的是原始版本的一个分支,它在检索名称中有空格的字体时工作得更好。
编辑:正如luckyrumo指出的那样,字体被放弃了,取而代之的是:https://github.com/fontsource/fontsource
如果您正在使用Webpack,您可能会对这个项目感兴趣:https://github.com/KyleAMathews/typefaces
例如,你想使用Roboto字体:
npm install typeface-roboto --save
然后把它导入你的应用的入口点(主js文件):
import 'typeface-roboto'
由于您希望在自己的服务器上托管所有字体(或部分字体),您可以从这个repo下载字体并以您想要的方式使用它:https://github.com/praisedpk/Local-Google-Fonts
如果你只是想这样做来解决谷歌字体附带的浏览器缓存问题,你可以使用替代字体CDN,并包括字体为:
<link href="https://pagecdn.io/lib/easyfonts/fonts.css" rel="stylesheet" />
或一种特定的字体,如:
<link href="https://pagecdn.io/lib/easyfonts/lato.css" rel="stylesheet" />