Google Fonts không hoạt động ở Trung Quốc - Cách khắc phục
Lý do chúng tôi đang sử dụng Google API để phục vụ các thư viện như jQuery và Web Fonts là vì nó phục vụ nhanh chóng thông qua các cơ sở hạ tầng đáng tin cậy của Google. Nó được sử dụng ở hầu hết mọi nơi và nhiều người dùng có thể đã lưu trữ bộ nhớ cache trong trình duyệt của họ, điều này khiến các thư viện tải cũng nhanh hơn.
Thật không may, đó không phải là trường hợp ở Trung Quốc. Chính phủ Trung Quốc đã đóng quyền truy cập vào nhiều dịch vụ của Google, bao gồm Google API vào năm 2014. Rất có thể trang web của bạn có thể xuất hiện một phần bị hỏng ở Trung Quốc vì các phông chữ jQuery và web được lưu trữ trong Google không thể truy cập được.
Trong bài đăng này, chúng tôi sẽ xem làm thế nào để vượt qua Vạn Lý Trường Thành "kỹ thuật số" của Trung Quốc, để trang web của chúng tôi có thể chạy như cách nó được xem bên ngoài Trung Quốc. Chúng tôi sẽ sử dụng một thư viện phông chữ thay thế phản chiếu Google Fonts và thư viện, nhưng trước tiên chúng tôi sẽ cần đưa ra một số biện pháp để xác định người dùng đến từ Trung Quốc.
Xác định vị trí người dùng
Để bắt đầu, chúng tôi sẽ cần tìm nơi khách truy cập của chúng tôi đến và để làm như vậy, chúng tôi sẽ sử dụng API WIPMania này cho phép truy xuất vị trí địa lý của khách truy cập, bao gồm cả tên quốc gia của họ:
$ .getJSON ('http://api.wipmania.com/jsonp?callback=?', hàm (dữ liệu) swal ('Bạn đến từ', data.address.country);); Chúng tôi sử dụng jQuery $ .getJSON để gọi API. Chúng tôi sau đó vượt qua data.address.countrymà sẽ cho chúng tôi biết khách đến từ đâu. Đây là một bản demo.
Cung cấp nguồn phông chữ thay thế
Vì vậy, bây giờ chúng tôi có thể truy xuất vị trí khách truy cập của mình, chúng tôi sẽ thay thế Google Fonts bằng thư viện Useso, dịch vụ CDN phản chiếu Phông chữ và Thư viện từ Google API, để phục vụ khách truy cập từ Trung Quốc.
Ở giai đoạn này, chúng tôi vẫn có các kiểu phông chữ của mình trỏ đến Google API:
Chúng tôi sẽ thay thế href trong liên kết phần tử có chức năng JavaScript.
chức năng thay thế GoogleCDN () $ ('link'). Each (function () var $ intial = $ (this) .attr ('href'), $ thay = $ intial.replace ('// Font.googleapis.com / ',' //fonts.useso.com/ '); $ (này) .attr (' href ', $ thay thế);); Hàm này thay thế từng liên kết để tham khảo //fonts.useso.com/ thay cho địa chỉ Google API, //fonts.googleapis.com/.
Chức năng sẽ chỉ chạy khi khách truy cập đến từ CN, Mã quốc gia của Trung Quốc.
$ .getJSON ('http://api.wipmania.com/jsonp?callback=?', hàm (dữ liệu) if (data.address.country_code == 'CN') thay thế GoogleCDN ();); Tất cả chúng ta đều được sắp xếp. Bây giờ, khách truy cập từ Trung Quốc sẽ được phục vụ phông chữ thông qua //fonts.useso.com/ vốn không bị chặn bởi chính phủ Trung Quốc.
