Pagina inicial » Codificação » Fontes do Google não funcionam na China - Como corrigir

    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.countryque 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.