API dành cho nhà phát triển cấp quyền truy cập vào siêu dữ liệu của tất cả các gia đình do Google Fonts phân phát. API này cho phép các ứng dụng truy vấn Google Fonts để biết các bộ phông chữ có sẵn. API REST cung cấp dữ liệu ở định dạng JSON, bao gồm các kiểu và tập lệnh (được gọi là tập hợp con trong Google Fonts) trong mỗi gia đình. API có thể sắp xếp danh sách các gia đình theo thứ tự bảng chữ cái, theo ngày thêm, theo số lượng kiểu, theo xu hướng hoặc theo mức độ phổ biến.
Đối tượng
Tài liệu này dành cho nhà phát triển web và ứng dụng. Để sử dụng API dành cho nhà phát triển, bạn cần có kiến thức về JavaScript.
Ví dụ nhanh
Để truy xuất danh sách phông chữ động do dịch vụ Google Fonts cung cấp, hãy gửi yêu cầu sau:
https://www.googleapis.com/webfonts/v1/webfonts?key=YOUR-API-KEY
Kết quả mẫu sẽ có dạng như sau:
{
"kind": "webfonts#webfontList",
"items": [
[...]
{
"family": "Anonymous Pro",
"variants": [
"regular",
"italic",
"700",
"700italic"
],
"subsets": [
"cyrillic",
"greek",
"latin",
"latin-ext"
],
"version": "v21",
"lastModified": "2022-09-22",
"files": {
"regular": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2Bp2a15UIB7Un-bOeISG3pLlw89CH98Ko.ttf",
"italic": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2fp2a15UIB7Un-bOeISG3pHl428AP44Kqr2Q.ttf",
"700": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2cp2a15UIB7Un-bOeISG3pFuAT0CnW7KOywKo.ttf",
"700italic": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2ap2a15UIB7Un-bOeISG3pHl4OTCzc6IG30KqB9Q.ttf"
},
"category": "monospace",
"kind": "webfonts#webfont",
"menu": "http://fonts.gstatic.com/s/anonymouspro/v21/rP2Bp2a15UIB7Un-bOeISG3pHl028A.ttf"
},
{
"family": "Antic",
"variants": [
"regular"
],
"subsets": [
"latin"
],
"version": "v19",
"lastModified": "2022-09-22",
"files": {
"regular": "http://fonts.gstatic.com/s/antic/v19/TuGfUVB8XY5DRaZLodgzydtk.ttf"
},
"category": "sans-serif",
"kind": "webfonts#webfont",
"menu": "http://fonts.gstatic.com/s/antic/v19/TuGfUVB8XY5DRZZKq9w.ttf"
},
[...]
]
}
Xác định ứng dụng của bạn với Google
Ứng dụng của bạn cần tự xác định mỗi khi gửi yêu cầu đến API dành cho nhà phát triển Google Fonts, bằng cách thêm khoá API vào mỗi yêu cầu.
Lấy và sử dụng khoá API
Mua khoáHoặc tạo một mã trong trang Thông tin xác thực.
Sau khi bạn có khoá API, ứng dụng của bạn có thể thêm tham số truy vấn key=yourAPIKey vào tất cả URL yêu cầu.
Khoá API an toàn để nhúng vào URL; không cần mã hoá.
Thông tin chi tiết
Phản hồi JSON (tham khảo mẫu ở trên) bao gồm một mảng có tên "items" (mặt hàng) chứa các đối tượng có thông tin về từng bộ phông chữ.
Đối tượng gia đình bao gồm các trường sau:
- kind: Loại đối tượng, đối tượng phông chữ web
- family: Tên của gia đình
- tập hợp con: Danh sách tập lệnh được gia đình hỗ trợ
- trình đơn: URL đến tập hợp con gia đình chỉ bao gồm tên của gia đình.
- variants: Các kiểu có sẵn cho gia đình
- version: Phiên bản bộ phông chữ.
- axes: Phạm vi trục, Chỉ xuất hiện khi có yêu cầu(xem bên dưới) đối với phông chữ biến thể.
- lastModified: Ngày (định dạng "yyyy-MM-dd") mà bộ phông chữ được sửa đổi lần gần đây nhất.
- tệp: Tệp bộ phông chữ (có tất cả các tập lệnh được hỗ trợ) cho từng biến thể có sẵn.
Bằng cách kết hợp thông tin cho từng gia đình, bạn có thể dễ dàng tạo yêu cầu Fonts API. Ví dụ: giả sử chúng ta có một tham chiếu đến đối tượng gia đình cho Anonymous Pro:
[...]
var apiUrl = [];
apiUrl.push('https://fonts.googleapis.com/css?family=');
apiUrl.push(anonymousPro.family.replace(/ /g, '+'));
if (contains('italic', anonymousPro.variants)) {
apiUrl.push(':');
apiUrl.push('italic');
}
if (contains('greek', anonymousPro.subsets)) {
apiUrl.push('&subset=');
apiUrl.push('greek');
}
// url: 'https://fonts.googleapis.com/css?family=Anonymous+Pro:italic&subset=greek'
var url = apiUrl.join('');
[...]
Sắp xếp
Theo mặc định, danh sách các gia đình được trả về không theo thứ tự cụ thể. Tuy nhiên, bạn có thể sắp xếp danh sách bằng cách sử dụng tham số sắp xếp:
https://www.googleapis.com/webfonts/v1/webfonts?sort=popularity
Các giá trị sắp xếp có thể có là:
- alpha: Sắp xếp danh sách theo thứ tự bảng chữ cái
- date: Sắp xếp danh sách theo ngày thêm (phông chữ gần đây nhất được thêm hoặc cập nhật trước tiên)
- popularity: Sắp xếp danh sách theo mức độ phổ biến (gia đình phổ biến nhất xếp trước)
- style: Sắp xếp danh sách theo số lượng kiểu có sẵn (gia đình có nhiều kiểu nhất trước tiên)
- xu hướng: Sắp xếp danh sách theo những gia đình có mức tăng trưởng về mức sử dụng (gia đình có mức tăng trưởng nhiều nhất sẽ xuất hiện trước tiên)
Lọc
Truy vấn một gia đình cụ thể
https://www.googleapis.com/webfonts/v1/webfonts?family=family_name
Tất cả các bộ phông chữ hỗ trợ tập hợp con tiếng Hy Lạp
https://www.googleapis.com/webfonts/v1/webfonts?subset=subset_name
Lọc theo danh mục phông chữ
https://www.googleapis.com/webfonts/v1/webfonts?category=category_name
Tối ưu hoá
Để truy xuất tệp phông chữ được nén ở định dạng woff2
https://www.googleapis.com/webfonts/v1/webfonts?capability=WOFF2
Phông chữ biến đổi
Phông chữ biến đổi cung cấp các kiểu liên tục. Theo mặc định, một tổ hợp các tệp phông chữ tĩnh sẽ được trả về cho các phông chữ biến thể được tạo bản sao ở các vị trí tiêu chuẩn.
Nếu bạn đặt capability=VF, tệp phông chữ biến sẽ được trả về thay vì các tệp phông chữ tĩnh cùng với siêu dữ liệu phạm vi trục có sẵn. Ví dụ mẫu:
https://www.googleapis.com/webfonts/v1/webfonts?capability=VF
Câu trả lời mẫu:
{
"kind": "webfonts#webfontList",
"items": [
[...]
{
"family": "Noto Sans Display",
"variants": [
"regular",
"italic"
],
"subsets": [
"cyrillic",
"cyrillic-ext",
"greek",
"greek-ext",
"latin",
"latin-ext",
"vietnamese"
],
"version": "v20",
"lastModified": "2022-09-22",
"files": {
"regular": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLplK4fy6r6tOBEJg0IAKzqdFZVZxokvfn_BDLxR.ttf",
"italic": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLpjK4fy6r6tOBEJg0IAKzqdFZVZxrktdHvjCaxRgew.ttf"
},
"category": "sans-serif",
"kind": "webfonts#webfont",
"menu": "http://fonts.gstatic.com/s/notosansdisplay/v20/RLpbK4fy6r6tOBEJg0IAKzqdFZVZxpMkXJMhnB9XjO1o90LuV-PT4Doq_AKp_3cKZTCa3g.ttf",
"axes": [
{
"tag": "wdth",
"start": 62.5,
"end": 100
},
{
"tag": "wght",
"start": 100,
"end": 900
}
]
},
[...]
]
}
Quy cách URL API
webfonts?key=<your_key>[&family=<family>][&subset=<subset>][&capability=<capability>...][&sort=<sort>]
your_key: Khoá API dành cho nhà phát triển của bạn.
family: Tên của một bộ phông chữ.
subset: Tên của một tập hợp con phông chữ.
category: serif | sans-serif | monospace | display | handwriting
capability: VF | WOFF2.
sort: alpha | date | popularity | style | trending.