API สําหรับนักพัฒนาแอป

Developer API ให้สิทธิ์เข้าถึงข้อมูลเมตาของทุกแบบอักษรที่ Google Fonts ให้บริการ ซึ่งช่วยให้แอปค้นหาชุดแบบอักษรที่มีอยู่ใน Google Fonts ได้ REST API จะแสดงข้อมูลในรูปแบบ JSON ซึ่งมีสไตล์และสคริปต์ (เรียกว่าชุดย่อยใน Google Fonts) ในแต่ละตระกูล API สามารถจัดเรียงรายการครอบครัวตามลำดับตัวอักษร วันที่เพิ่ม จำนวนสไตล์ แนวโน้ม หรือความนิยม

ผู้ชม

เอกสารนี้มีไว้สําหรับนักพัฒนาเว็บและแอปพลิเคชัน การใช้ Developer API จำเป็นต้องมีความรู้เกี่ยวกับ JavaScript

ตัวอย่างคร่าวๆ

หากต้องการเรียกข้อมูลแบบไดนามิกของแบบอักษรที่บริการ Google Fonts นำเสนอ ให้ส่งคำขอต่อไปนี้

https://www.googleapis.com/webfonts/v1/webfonts?key=YOUR-API-KEY

ตัวอย่างผลลัพธ์จะมีลักษณะดังนี้

{
 "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"
  },
  [...]
 ]
}

ระบุแอปพลิเคชันของคุณให้ Google ทราบ

แอปพลิเคชันต้องระบุตัวตนทุกครั้งที่ส่งคำขอไปยัง Google Fonts Developer API โดยใส่คีย์ API ไว้ในคำขอแต่ละรายการ

การรับและใช้คีย์ API

ซื้อคีย์

หรือสร้างในหน้าข้อมูลเข้าสู่ระบบ

หลังจากมีคีย์ API แล้ว แอปพลิเคชันจะเพิ่มพารามิเตอร์การค้นหา key=yourAPIKey ต่อท้าย URL คำขอทั้งหมดได้

คีย์ API ปลอดภัยสำหรับการฝังใน URL โดยไม่จำเป็นต้องเข้ารหัส

รายละเอียด

การตอบกลับ JSON (ดูตัวอย่างด้านบน) ประกอบด้วยอาร์เรย์ชื่อ "items" ซึ่งมีออบเจ็กต์ที่มีข้อมูลเกี่ยวกับแบบอักษรแต่ละตระกูล

ออบเจ็กต์ครอบครัวประกอบด้วยช่องต่อไปนี้

• kind: ประเภทของออบเจ็กต์ ซึ่งเป็นออบเจ็กต์แบบเว็บฟอนต์
• family: ชื่อของครอบครัว
• รายการย่อย: รายการสคริปต์ที่ครอบครัวรองรับ
• menu: URL ไปยังชุดย่อยของครอบครัวที่มีเพียงชื่อของครอบครัว
• variants: รูปแบบต่างๆ ที่มีสำหรับครอบครัว
• version: เวอร์ชันชุดแบบอักษร
• axes: ช่วงแกน แสดงเฉพาะเมื่อมีคำขอ(ดูด้านล่าง) สำหรับแบบอักษรแบบผันแปร
• lastModified: วันที่ (รูปแบบ "yyyy-MM-dd") ที่แก้ไขชุดแบบอักษรครั้งล่าสุด
• ไฟล์: ไฟล์ตระกูลแบบอักษร (ที่มีสคริปต์ที่รองรับทั้งหมด) สำหรับแต่ละรูปแบบที่ใช้ได้

การรวมข้อมูลของแต่ละครอบครัวจะช่วยให้คุณสร้างคำขอ Fonts API ได้ง่ายๆ ตัวอย่างเช่น สมมติว่าเรามีข้อมูลอ้างอิงไปยังออบเจ็กต์ครอบครัวสำหรับ 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('');

[...]

การจัดเรียง

ระบบจะแสดงรายการครอบครัวตามลำดับที่ไม่เจาะจงโดยค่าเริ่มต้น อย่างไรก็ตาม คุณสามารถจัดเรียงรายการได้โดยใช้พารามิเตอร์การจัดเรียง ดังนี้

https://www.googleapis.com/webfonts/v1/webfonts?sort=popularity

ค่าการจัดเรียงที่เป็นไปได้มีดังนี้

• alpha: จัดเรียงรายการตามลำดับตัวอักษร
• date: จัดเรียงรายการตามวันที่เพิ่ม (เพิ่มหรืออัปเดตแบบอักษรล่าสุดก่อน)
• ความนิยม: จัดเรียงรายการตามความนิยม (ครอบครัวยอดนิยมก่อน)
• style: จัดเรียงรายการตามจํานวนสไตล์ที่ใช้ได้ (ครอบครัวที่มีสไตล์มากที่สุดจะแสดงก่อน)
• กำลังมาแรง: จัดเรียงรายการตามครอบครัวที่มีการใช้งานเพิ่มขึ้น (ครอบครัวที่มีการใช้งานเพิ่มขึ้นมากที่สุดก่อน)

การกรอง

ค้นหาครอบครัวที่เฉพาะเจาะจง

https://www.googleapis.com/webfonts/v1/webfonts?family=family_name

ครอบครัวทั้งหมดที่รองรับชุดย่อยภาษากรีก

https://www.googleapis.com/webfonts/v1/webfonts?subset=subset_name

กรองตามหมวดหมู่แบบอักษร

https://www.googleapis.com/webfonts/v1/webfonts?category=category_name

การเพิ่มประสิทธิภาพ

สําหรับการเรียกข้อมูลไฟล์แบบอักษรที่บีบอัดในรูปแบบ woff2

https://www.googleapis.com/webfonts/v1/webfonts?capability=WOFF2

แบบอักษรที่ปรับแต่งได้

แบบอักษรแบบแปรผันมีรูปแบบที่หลากหลาย โดยค่าเริ่มต้น ระบบจะแสดงผลไฟล์แบบอักษรแบบคงที่ผสมกันสำหรับแบบอักษรแบบแปรผันที่สร้างอินสแตนซ์ในตำแหน่งมาตรฐาน หากตั้งค่า capability=VF ระบบจะแสดงผลไฟล์แบบอักษรแบบแปรผันแทนแบบคงที่ พร้อมกับข้อมูลเมตาช่วงแกนที่พร้อมใช้งาน ตัวอย่าง

https://www.googleapis.com/webfonts/v1/webfonts?capability=VF

ตัวอย่างการตอบกลับ

{
 "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
      }
    ]
  },
  [...]
 ]
}

ข้อกำหนดของ URL ของ API

webfonts?key=<your_key>[&family=<family>][&subset=<subset>][&capability=<capability>...][&sort=<sort>]

your_key: คีย์ API ของนักพัฒนาแอป

family: ชื่อชุดแบบอักษร

subset: ชื่อชุดย่อยแบบอักษร

category: serif | sans-serif | monospace | display | handwriting

capability: VF | WOFF2

sort: alpha | date | popularity | style | trending