Google Font Tidak Bekerja di China - Bagaimana Betulkannya
Sebab kami menggunakan Google API untuk berkhidmat perpustakaan seperti jQuery dan Font Web adalah ia berfungsi dengan cepat melalui infrastruktur yang boleh dipercayai Google. Ia digunakan hampir di mana-mana, dan banyak lagi bahawa sesetengah pengguna mungkin sudah mempunyai cache yang tersimpan dalam penyemak imbas mereka, yang menjadikan perpustakaan dimuatkan walaupun lebih pantas.
Malangnya, itu tidak berlaku di China. Kerajaan China menutup akses kepada banyak perkhidmatan Google termasuk Google API pada tahun 2014. Kemungkinan adalah bahawa laman web anda mungkin muncul sebahagiannya pecah di China kerana fon jQuery dan web yang dihoskan di Google tidak boleh diakses.
Dalam catatan ini, kita akan melihat cara memintas Tembok Besar "digital" China, jadi laman web kami boleh berjalan seperti bagaimana ia dilihat di luar China. Kami akan menggunakan perpustakaan font alternatif yang mencerminkan Google Font dan perpustakaan, tetapi pertama-tama kami perlu memasukkan beberapa langkah untuk mengenal pasti pengguna yang berasal dari China.
Mengenal pasti Lokasi Pengguna
Untuk memulakan, kami perlu mencari tempat pelawat kami dan untuk berbuat demikian, kami akan menggunakan API WIPMania ini yang membolehkan pengambilan geolokasi pelawat, termasuk nama negara mereka:
$ .getJSON ('http://api.wipmania.com/jsonp?callback=?', fungsi (data) swal ('Anda berasal dari', data.address.country););
Kami menggunakan jQuery $ .getJSON
untuk memanggil API. Kami kemudiannya lulus data.address.country
yang harus memberitahu kami di mana pengunjung berasal. Berikut adalah demo.
Menyediakan Sumber Web Font Alternatif
Jadi sekarang kita dapat mengambil lokasi pelawat kami, kami akan menggantikan Google Font dengan Perpustakaan Usingo, perkhidmatan CDN yang mencerminkan Font dan Perpustakaan dari Google API, untuk melayani pengunjung dari China.
Pada peringkat ini, kami masih mempunyai gaya font kami yang menunjuk kepada Google API:
Kami akan menggantikannya href
Di antara pautan
elemen dengan fungsi JavaScript.
(replace) $ intial.replace ('// fonts.googleapis.com') $ ('link') setiap (fungsi () var $ intial = / ',' //fonts.useso.com/ '); $ (this) .attr (' href ', $ replace););
Fungsi ini menggantikan setiap pautan untuk merujuk kepada //fonts.useso.com/
sebagai ganti menunjuk ke alamat API Google, //fonts.googleapis.com/
.
Fungsi ini akan dijalankan hanya apabila pengunjung berasal CN
, Kod negara antarabangsa China.
$ .getJSON ('http://api.wipmania.com/jsonp?callback=?', fungsi (data) if (data.address.country_code == 'CN') replaceGoogleCDN (););
Kita sudah siap. Sekarang, pelawat dari China akan dihidangkan melalui fon //fonts.useso.com/
yang tidak disekat oleh kerajaan China.