Fontes do Google não funcionam na China - Como corrigir
A razão pela qual estamos usando a API do Google para servir bibliotecas como jQuery e Web Fonts é que ela é veiculada rapidamente pelas infraestruturas confiáveis do Google. É usado em quase todos os lugares e tanto que alguns usuários já podem ter o cache armazenado em seu navegador, o que faz com que as bibliotecas sejam carregadas até Mais rápido.
Infelizmente, esse não é o caso da China. O governo da China fechou o acesso a muitos dos serviços do Google, incluindo a API do Google em 2014. As chances são de que seu website possa aparecem parcialmente quebrados na China porque as fontes jQuery e web hospedadas no Google são inacessíveis.
Neste post, vamos ver como contornar a Grande Muralha "digital" da China, para que o nosso site funcione como se fosse visto fora da China. Estaremos usando uma biblioteca de fontes alternativa que espelha o Google Fonts e as bibliotecas, mas primeiro precisaremos colocar algumas medidas para identificar os usuários que vêm da China..
Identificando o local do usuário
Para começar, precisaremos descobrir de onde vem nosso visitante e, para isso, usaremos essa API do WIPMania que permite a recuperação da geolocalização de um visitante, incluindo o nome do país:
$ .getJSON ('http://api.wipmania.com/jsonp?callback=?', function (data) swal ('Você é de', data.address.country););
Nós usamos jQuery $ .getJSON
para chamar a API. Nós então passamos data.address.country
que deve nos dizer de onde o visitante é. Aqui está uma demonstração.
Fornecendo fonte de fonte da Web alternativa
Portanto, agora que podemos recuperar a localização de nossos visitantes, substituiremos as bibliotecas do Google Fonts por Useso, um serviço CDN que espelha fontes e bibliotecas da API do Google, para atender aos visitantes da China.
Neste estágio, ainda temos nossos estilos de fonte apontando para a API do Google:
Vamos substituir o href
dentro do ligação
elemento com uma função JavaScript.
function replaceGoogleCDN () $ ('link'). each (função () var $ intial = $ (this) .attr ('href'), $ substituir = $ intial.replace ('// fonts.googleapis.com / ',' //fonts.useso.com/ '); $ (this) .attr (' href ', $ replace););
Esta função substitui cada link para se referir a //fonts.useso.com/
em vez de apontar para o endereço da API do Google, //fonts.googleapis.com/
.
A função será executada apenas quando o visitante é de CN
, Código internacional do país da China.
$ .getJSON ('http://api.wipmania.com/jsonp?callback=?', função (dados) if (data.address.country_code == 'CN') replaceGoogleCDN (););
Estamos todos prontos. Agora, os visitantes da China receberão fontes via //fonts.useso.com/
que não é bloqueado pelo governo chinês.