Laman » Pengekodan » Google Font Tidak Bekerja di China - Bagaimana Betulkannya

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