Шрифти Google не працюють в Китаї - як це виправити

Причина, через яку ми використовуємо Google API для обслуговування бібліотек, таких як jQuery і веб-шрифти, полягає в тому, що вона швидко працює через надійну інфраструктуру Google. Він використовується майже скрізь, і стільки, що у деяких користувачів вже є кеш, що зберігається в їхньому браузері, що робить завантаження бібліотек навіть швидше.

На жаль, у Китаї це не так. Уряд Китаю закрив доступ до багатьох послуг Google, включаючи Google API, у 2014 році з'являються частково порушені в Китаї, оскільки jQuery і веб-шрифти, розміщені в Google, недоступні.

На цій посаді ми побачимо, як обійти китайську «цифрову» Велику стіну, тому наш сайт може працювати так, як його розглядають за межами Китаю. Ми будемо використовувати альтернативну бібліотеку шрифтів, яка віддзеркалює Google Fonts і бібліотеки, але спочатку нам потрібно буде ввести деякі заходи для ідентифікації користувачів, які походять з Китаю.

Визначення місцезнаходження користувача

Почнемо з того, що нам потрібно знайти, де знаходиться наш відвідувач, і для цього ми будемо використовувати цей WIPMania API, який дозволяє отримувати геолокацію відвідувача, включаючи назву країни:

 $ .getJSON ('http://api.wipmania.com/jsonp?callback=?', функція (дані) swal ('Ви з', data.address.country);); 

Ми використовуємо jQuery $ .getJSON викликати API. Потім ми проходимо data.address.countryякий повинен розповісти нам, звідки відвідувач. Ось демо.

Забезпечення альтернативного джерела веб-шрифтів

Так що тепер, коли ми можемо отримати місце для відвідувачів, ми замінимо шрифти Google з бібліотеками Useso, службою CDN, яка віддзеркалює шрифти та бібліотеки з API Google, щоб обслуговувати відвідувачів з Китаю.

На цьому етапі ми все ще маємо стилі шрифту, які вказують на Google API:

Ми замінимо href в межах посилання елемент з функцією JavaScript.

 функція replaceGoogleCDN () $ ('link'). кожна (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') замінитеGoogleCDN ();); 

Ми всі готові. Тепер відвідувачам з Китаю буде надано шрифти через //fonts.useso.com/ який не блокується китайським урядом.