Developer API

Developer API では、サービスを提供しているすべてのファミリーのメタデータにアクセスできます。 ダウンロードしますアプリからクエリを実行できる 利用可能なフォント ファミリーの 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 キーの取得と使用

キーの取得

または、認証情報ページでキーを作成することもできます。

API キーを作成したら、アプリケーションですべてのリクエスト URL の末尾にクエリ パラメータ key=yourAPIKey を追加できます。

API キーは、安全に URL に埋め込むことができます。エンコーディングの必要はありません。

詳細

JSON レスポンス(上記のサンプルを参照)は、「items」という名前の配列で構成されます。 このオブジェクトには、各フォント ファミリーに関する情報が格納されています。

ファミリー オブジェクトは以下のフィールドで構成されています。

  • kind: オブジェクトの種類、ウェブフォント オブジェクト
  • family: ファミリーの名前
  • サブセット: ファミリーでサポートされているスクリプトのリスト
  • メニュー: ファミリーの名前のみが含まれるファミリー サブセットの URL。
  • バリエーション: ファミリーで使用可能なさまざまなスタイル
  • version: フォント ファミリーのバージョン。
  • axes: 軸の範囲。可変フォントの場合はリクエストがあった場合のみ表示されます(下記参照)。
  • lastModified: フォント ファミリーが変更された日付(形式は「yyyy-MM-dd」) できません。
  • files: 各アプリケーションのフォント ファミリー ファイル(サポートされているすべてのスクリプトを含む) バリエーションが表示されます。

各ファミリーの情報を組み合わせることで、Fonts API を簡単に作成できる リクエストできます。たとえば、API 呼び出しのファミリー オブジェクトへの参照が 匿名の 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('');

[...]

並べ替え

デフォルトでは、ファミリーのリストは順不同で返されます。内容 ただし、sort パラメータを使用してリストを並べ替えることができます。

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

並べ替え可能な値は次のとおりです。

  • alpha: リストをアルファベット順に並べ替えます
  • date: 追加日でリストを並べ替えます(最新のフォントが最初に追加または更新された日)。
  • 人気度: 人気順(人気のファミリー順)にリストを並べ替える
  • style: 利用可能なスタイルの数(ほとんどのスタイルを持つファミリー)でリストを並べ替え 1 つ目)
  • [急上昇]: 使用量が増えているファミリー( 成長率を最優先)

フィルタリング

特定のファミリーをクエリする

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

可変フォント

可変フォントを使用すると、連続的な範囲のスタイルを実現できます。デフォルトでは、 静的フォント ファイルは、標準 HTML フォントでインスタンス化され、 できます。 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