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

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

ผู้ชม

เอกสารนี้มีไว้สำหรับนักพัฒนาเว็บและแอปพลิเคชัน การใช้ 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: ชื่อครอบครัว
• ชุดย่อย: รายการสคริปต์ที่ครอบครัวรองรับ
• เมนู: URL ชุดย่อยของครอบครัวที่ครอบคลุมเฉพาะชื่อครอบครัวเท่านั้น
• ตัวแปร: สไตล์ต่างๆ ที่ใช้ได้กับครอบครัว
• version: เวอร์ชันชุดแบบอักษร
• แกน: ช่วงของแกน แสดงตามคำขอเท่านั้น(ดูด้านล่าง) สำหรับแบบอักษรที่เปลี่ยนแปลงได้
• lastแก้ไข: วันที่ (รูปแบบ "ปปปป-ดด-วว") ที่แก้ไขชุดแบบอักษรเป็นครั้งล่าสุด
• ไฟล์: ไฟล์ชุดแบบอักษร (พร้อมสคริปต์ที่รองรับทั้งหมด) สำหรับผลิตภัณฑ์ย่อยแต่ละรายการที่มีอยู่

การรวมข้อมูลของแต่ละครอบครัวเข้าด้วยกันจะทำให้สร้างคำขอ 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

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

• อัลฟ่า: จัดเรียงรายการตามตัวอักษร
• วันที่: จัดเรียงรายการตามวันที่เพิ่ม (แบบอักษรล่าสุดที่เพิ่มหรืออัปเดตก่อน)
• ความนิยม: จัดเรียงรายการตามความนิยม (ครอบครัวได้รับความนิยมมากที่สุดก่อน)
• สไตล์: จัดเรียงรายการตามจำนวนรูปแบบที่มี (ครอบครัวที่มีสไตล์ส่วนใหญ่ก่อน)
• มาแรง: จัดเรียงรายการตามครอบครัวที่เห็นการเพิ่มขึ้นของปริมาณการใช้งาน (ครอบครัวเห็นการเติบโตมากที่สุดก่อน)

การกรอง

ค้นหาครอบครัวที่ต้องการ

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

ทุกครอบครัวที่รองรับกลุ่มย่อยของกรีก

https://www.googleapis.com/webfonts/v1/webfonts?subset=subset_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
      }
    ]
  },
  [...]
 ]
}

ข้อกำหนด API URL

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

your_key: คีย์ API สำหรับนักพัฒนาซอฟต์แวร์

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

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

capability: VF | WOFF2

sort: alpha | date | popularity | style | trending