Question

自2014年以来，中国正在阻止Google API，这意味着包含Map API或Fonts API的网站的加载时间较长。有一种解决方法，因为fonts.useso.com也提供相同的字体库（分别参见libs.useso.com，fonts.useso.com）。

以下代码

<link href='http://fonts.googleapis.com/css?family=Open+Sans:300,400,600&subset=latin,latin-ext' rel='stylesheet'>

可以改为

<link href='http://fonts.useso.com/css?family=Open+Sans:300,400,600&subset=latin,latin-ext' rel='stylesheet'>

它在中国会很好用。

但是，如果我想动态选择我想加载API的源，考虑用户访问的位置，该怎么办？

Answer 1

您可以使用第三方服务来确定用户位置并切换字体。

例如，您可以集成免费的userinfo.io。在这种情况下，位置是根据IP地址确定的，因此，如果中国人从欧洲访问，他将位于欧洲，并且将加载谷歌字体。

将其插入<head>：

<script type="text/javascript" href="//cdnjs.cloudflare.com/ajax/libs/userinfo/1.0.0/userinfo.min.js"></script>

<script type="text/javascript">
UserInfo.getInfo(function(data) {
  // the "data" object contains the info
  if (data.country.code == 'CN') {
    // load your fallback fonts
  } else {
    // Load your google fonts
  }
}, function(err) {
  // the "err" object contains useful information in case of an error
});
</script>

免责声明：我编写并维护了userinfo.io

Answer 2

时区将起到作用：

var offset = new Date().getTimezoneOffset();
if(offset/60 == -8){
    console.log('Hello from China!');
}

请注意，这会忽略时钟配置不正确的客户端，但可以涵盖大多数情况。

Answer 3

我偶然发现了另一个解决方案，我想分享一下。我认为它很酷，因为不需要包含库，但只通过ajax请求获取信息。

function replaceGoogleCDN() {
  $('link').each(function(){
    var $intial  = $(this).attr('href'),
        $replace = $intial.replace('//fonts.googleapis.com/', '//fonts.useso.com/');
        $(this).attr('href', $replace);
  });
}

$.getJSON('//api.wipmania.com/jsonp?callback=?', function (data) { 
  if ( data.address.country_code == 'CN' ) {
    replaceGoogleCDN();
  }
});

编辑：不是一个很棒的解决方案，如果您使用https，因为您无法从http源加载，并且wipmania似乎没有有效的ssl证书。

Source

Answer 4

现在，Google字体正在中国的服务器上托管，从而消除了缓慢的加载时间。（截至2016年8月）有关完整说明，请参阅我的回答here。

检查用户是否使用位于中国的浏览器

4 个答案: