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

Developer API จะให้สิทธิ์เข้าถึงข้อมูลเมตาของทุกครอบครัวที่ให้บริการ โดย Google Fonts ทำให้แอปค้นหา Google Fonts สำหรับชุดแบบอักษรที่ใช้ได้ API ของ REST จะให้ข้อมูลในรูปแบบ 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" ซึ่งมีออบเจ็กต์ที่มีข้อมูลเกี่ยวกับชุดแบบอักษรแต่ละชุด

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

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

การสร้าง Fonts API ก็ช่วยให้สร้าง Fonts API ได้ง่ายๆ ด้วยการรวมข้อมูลสำหรับแต่ละครอบครัว อีกครั้ง ตัวอย่างเช่น สมมติว่าเรามีการอ้างอิงไปยังออบเจ็กต์ครอบครัวสำหรับ มือโปรที่ไม่ระบุชื่อ:

[...]

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

การกรอง

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

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

ข้อมูลจำเพาะของ URL ของ API

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