解决fonts.gstatic.com无法访问

最近很多google的服务又在大陆地区受限了，原因不做过多讨论。屏蔽这些服务不仅仅意味着gmail,谷歌学术等方便的工具使用受到限制，更意味着很多寄托于google的web服务无法使用。wordpress很多的主题都使用了google上的字体文件、css文件、js文件等，屏蔽之后访问速度会奇慢无比甚至无法打开。

我这个博客主题也和很多wordpress主题一样使用了google fonts。一般不是登陆状态时候看不出什么异常，而如果处于登陆状态，并不通过缓存加载页面时（即使用ctrl+f5），会发现fonts.gstatic.com服务器根本无法连上。也就是说其实这个问题对一般访客没有任何影响，且不是很容易被发现。但既然发现了我们就要解决掉它。

解决方法：

一、将文件下载到本地

1.下载对应的css。这一步可以通过chrome、firefox等提供的审查元素功能。切换到网络（network）页面，找到无法访问的那个链接。比如我这里的是http://fonts.gstatic.com/css?family=Open+Sans%3A300italic%2C400italic%2C600italic%2C300%2C400%2C600&subset=latin%2Clatin-ext&ver=3.9，通过发送请求或者多次尝试浏览器打开之后，把里面的css内容复制到本地。

2.在下载的css文件中，批量查找出所有引用的字体文件的链接，比如：

@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 300;
  src: local('Open Sans Light'), local('OpenSans-Light'), url(http://fontstatic.useso.com/s/opensans/v10/DXI1ORHCpsQm3Vp6mXoaTRa1RVmPjeKy21_GQJaLlJI.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 400;
  src: local('Open Sans'), local('OpenSans'), url(http://fontstatic.useso.com/s/opensans/v10/u-WUoqrET9fUeobQW7jkRT8E0i7KZn-EPnyo3HZu7kw.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: normal;
  font-weight: 600;
  src: local('Open Sans Semibold'), local('OpenSans-Semibold'), url(http://fontstatic.useso.com/s/opensans/v10/MTP_ySUJH_bn48VBG8sNSha1RVmPjeKy21_GQJaLlJI.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 300;
  src: local('Open Sans Light Italic'), local('OpenSansLight-Italic'), url(http://fontstatic.useso.com/s/opensans/v10/PRmiXeptR36kaC0GEAetxrsuoFAk0leveMLeqYtnfAY.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 400;
  src: local('Open Sans Italic'), local('OpenSans-Italic'), url(http://fontstatic.useso.com/s/opensans/v10/xjAJXh38I15wypJXxuGMBtIh4imgI8P11RFo6YPCPC0.woff) format('woff');
}
@font-face {
  font-family: 'Open Sans';
  font-style: italic;
  font-weight: 600;
  src: local('Open Sans Semibold Italic'), local('OpenSans-SemiboldItalic'), url(http://fontstatic.useso.com/s/opensans/v10/PRmiXeptR36kaC0GEAetxmWeb5PoA5ztb49yLyUzH1A.woff) format('woff');
}

可以直接通过正则匹配：https://fonts.gstatic.*?.woff 找到所有的链接，然后批量下载（可以用迅雷或者其他下载工具），存储到本地服务器中。

3.把上面css里的woff字体文件的路径，修改成刚才保存的路径。

4.找到wp-includes 里面的 script-loader.php 有一行：

$open_sans_font_url = "//fonts.googleapis.com/css?family=Open+Sans:300italic,400italic,600italic,300,400,600&subset=$subsets";

把里面的链接修改为本地存储的css的链接，即可正常访问了。

这种方法的好处是不再依赖外部链接，但缺点是如果更新主题、或者更新wordpress可能会导致访问失效。

二、借助360 常用前端公共库

首先上链接： http://libs.useso.com/ 里面缓存了Google的前端公共库和免费字体库，不得不说，虽然是360做的东西，但确实很给力，收录全，访问速度快且稳定，点个赞吧。

这下就非常方便了，只需要执行方法1的第4步，把fonts.googleapis.com 换成 fonts.useco.com就大功告成了。

当然，如果在第一步始终无法访问页面，可以通过这里访问进入，再复制到本地。