Googleフォントが中国で機能しない - 修正方法

Google APIを使用してjQueryやWeb Fontsなどのライブラリを提供しているのは、Googleの信頼できるインフラストラクチャを介して迅速に機能するためです。ほとんどの場所で使用されていますが、ブラウザにキャッシュがすでに保存されているためにライブラリがロードされることもあります。 でも もっと早く.

残念ながら、中国ではそうではありません。中国政府は、2014年にGoogle APIを含むGoogleの多くのサービスへのアクセスを閉鎖しました。 部分的に壊れているように見える GoogleでホストされているjQueryおよびWebフォントにアクセスできないため、中国で.

この記事では、中国の「デジタル」万里の長城を迂回する方法を見ていきますので、私たちのウェブサイトは中国国外で見られるように運営することができます。 Googleフォントとライブラリを反映した代替フォントライブラリを使用する予定ですが、最初に中国出身のユーザーを特定するための対策を講じる必要があります。.

ユーザーの所在地の特定

まず最初に、訪問者の出身地を特定する必要があります。このWIPMania APIを使用して、訪問者の国名を含めた訪問者の位置情報を取得できます。

 $ .getJSON（ 'http://api.wipmania.com/jsonp?callback=？'、function（data）swal（ 'あなたは出身です'、data.address.country）;）; 

jQueryを使っています $ .getJSON APIを呼び出します。それから私達は渡します data.address.countryこれは、訪問者の出身地を教えてくれるはずです。これがデモです.

代替Webフォントソースの提供

これで、訪問者の場所を取得できるようになりました。GoogleFontsをUsesoライブラリ（Google APIのFontsとLibrariesを反映するCDNサービス）に置き換えて、中国からの訪問者にサービスを提供します。.

この段階では、Google APIを指すフォントスタイルがまだあります。

私達は取り替えます href 以内 リンク JavaScript関数を持つ要素.

 function replaceGoogleCDN（）$（ 'link'）。each（function（）var $ intial = $（this）.attr（ 'href'）、$ replace = $ intial.replace（ '// fonts.googleapis.com） / '、' //fonts.useso.com/ '）; $（this）.attr（' href '、$ replace）;）;  

この関数は参照するために各リンクを置き換えます //fonts.useso.com/ Google APIアドレスを指す代わりに, //fonts.googleapis.com/.

この関数は訪問者がから来たときにのみ実行されます CN, 中国の国際国番号.

 $ .getJSON（ 'http://api.wipmania.com/jsonp?callback=？'、関数（データ）if（data.address.country_code == 'CN'）replaceGoogleCDN（）;）; 

私たちはみんな決まっています。今、中国からの訪問者は経由でフォントを提供されます //fonts.useso.com/ これは中国政府によってブロックされない.