通过 Nginx 反向代理来加速 Google Fonts 文件的加载速度,实现更快的页面加载速度。
首先,你需要创建一个文件名为 google_fonts.conf 的配置文件(或者你可以将以下行添加到已有的 Nginx 配置文件中):
location /google-fonts/css/ {
sub_filter 'fonts.gstatic.com' '$host/google-fonts';
sub_filter_once off;
sub_filter_types text/css;
proxy_set_header Host fonts.googleapis.com;
proxy_set_header Accept-Encoding '';
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Scheme $scheme;
proxy_pass https://fonts.googleapis.com/css;
proxy_ignore_headers X-Accel-Expires Expires Cache-Control Set-Cookie Vary;
proxy_cache nginx-cache;
proxy_cache_valid 500 502 503 504 404 10s;
proxy_cache_valid 200 302 304 365d;
proxy_cache_key $support_woff2$host$uri$is_args$args;
add_header X-Proxy-Cache $upstream_cache_status;
expires max;
}
location /google-fonts/css2/ {
sub_filter 'fonts.gstatic.com' '$host/google-fonts';
sub_filter_once off;
sub_filter_types text/css;
proxy_set_header Host fonts.googleapis.com;
proxy_set_header Accept-Encoding '';
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Scheme $scheme;
proxy_pass https://fonts.googleapis.com/css2;
proxy_ignore_headers X-Accel-Expires Expires Cache-Control Set-Cookie;
proxy_cache nginx-cache;
proxy_cache_valid 500 502 503 504 404 10s;
proxy_cache_valid 200 302 304 365d;
proxy_cache_key $support_woff2$host$uri$is_args$args;
add_header X-Proxy-Cache $upstream_cache_status;
expires max;
}
location /google-fonts/icon/ {
sub_filter 'fonts.gstatic.com' '$host/google-fonts';
sub_filter_once off;
sub_filter_types text/css;
proxy_set_header Host fonts.googleapis.com;
proxy_set_header Accept-Encoding '';
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Scheme $scheme;
proxy_pass https://fonts.googleapis.com/icon;
proxy_ignore_headers X-Accel-Expires Expires Cache-Control Set-Cookie;
proxy_cache nginx-cache;
proxy_cache_valid 500 502 503 504 404 10s;
proxy_cache_valid 200 302 304 365d;
proxy_cache_key $support_woff2$host$uri$is_args$args;
add_header X-Proxy-Cache $upstream_cache_status;
expires max;
}
location ~ /google-fonts/.+\.(woff2|woff|svg|ttf)$ {
rewrite /google-fonts/(.*) /$1 break;
proxy_set_header Host fonts.gstatic.com;
proxy_redirect off;
proxy_set_header X-Real-IP $remote_addr;
proxy_set_header X-Scheme $scheme;
proxy_pass https://fonts.gstatic.com;
proxy_ignore_headers X-Accel-Expires Expires Cache-Control Set-Cookie;
proxy_cache nginx-cache;
proxy_cache_valid 500 502 503 504 404 10s;
proxy_cache_valid 200 302 304 365d;
proxy_cache_key $host$uri$is_args$args;
add_header X-Proxy-Cache $upstream_cache_status;
expires max;
}
这里“/google-fonts”是虚拟目录的名称,也可以使用任何其他名称,但必须与主站点 URL 路径相同。
然后,将以下行添加到 Nginx 主配置中,以从新配置的 google_fonts.conf 文件加载配置:
http {
proxy_temp_path /path/to/temp;
proxy_cache_path /path/to/cache levels=1:2 keys_zone=nginx-cache:256m max_size=5g inactive=365d;
include /path/to/google_fonts.conf;
# other directives
}
接下来,测试 Nginx 配置是否正确:
sudo nginx -t
如果没有错误,重新加载 Nginx 以使更改生效:
sudo service nginx reload
最后,该网站中的字体请求现在将从 googleapis.com 转到你的服务器,从而提高字体加载速度。
需要注意的是,此方法应该仅用于使用 Google Fonts 的网站,并需要遵守 Google 的服务条款。