API Developer

L'API Developer permet d'accéder aux métadonnées de toutes les familles proposées par Google Fonts. Il permet aux applications d'interroger Google Fonts pour connaître les familles de polices disponibles. L'API REST fournit des données au format JSON qui incluent les styles et les scripts (appelés sous-ensembles dans Google Fonts) de chaque famille. L'API peut trier la liste des familles par ordre alphabétique, par date d'ajout, par nombre de styles, par tendance ou par popularité.

Audience

Ce document est destiné aux développeurs Web et d'applications. Pour utiliser l'API Developer, vous devez connaître JavaScript.

Un bref exemple

Pour récupérer la liste dynamique des polices proposées par le service Google Fonts, envoyez la requête suivante :

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

Voici un exemple de résultat :

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

Identifier votre application auprès de Google

Votre application doit s'identifier chaque fois qu'elle envoie une requête à l'API Google Fonts Developer, en incluant une clé API dans chaque requête.

Obtenir et utiliser une clé API

Obtenir une clé

Vous pouvez également en créer un sur la page Identifiants.

Une fois la clé API obtenue, votre application peut ajouter le paramètre de requête key=yourAPIKey à toutes les URL de requête.

La clé API peut s'intégrer aux URL en toute sécurité et ne nécessite pas d'encodage.

Détails

La réponse JSON (voir l'exemple ci-dessus) est composée d'un tableau nommé "items" qui contient des objets avec des informations sur chaque famille de polices.

Un objet de famille se compose des champs suivants :

  • kind : type d'objet, un objet de police Web
  • family : nom de la famille
  • sous-ensembles : liste des scripts compatibles avec la famille
  • menu : URL du sous-ensemble de la famille ne couvrant que le nom de la famille.
  • variantes : les différents styles disponibles pour la famille
  • version : version de la famille de polices.
  • axes : plage d'axes, présente uniquement sur demande (voir ci-dessous) pour les polices variables.
  • lastModified : date (au format "yyyy-MM-dd") à laquelle la famille de polices a été modifiée pour la dernière fois.
  • files : fichiers de la famille de polices (avec tous les scripts compatibles) pour chacune des variantes disponibles.
  • color_capabilities : formats de couleur, le cas échéant, compatibles avec cette famille
  • tags : balises qui s'appliquent à l'ensemble de l'espace de conception de cette famille. Présent uniquement sur demande (voir ci-dessous).

En combinant les informations de chaque famille, il est facile de créer une requête Fonts API. Par exemple, en supposant que nous ayons une référence à l'objet de famille pour 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('');

[...]

Tri

Par défaut, la liste des familles est renvoyée sans ordre particulier. Il est toutefois possible de trier la liste à l'aide du paramètre de tri :

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

Les valeurs de tri possibles sont les suivantes :

  • alpha : trier la liste par ordre alphabétique
  • date : trier la liste par date d'ajout (les polices les plus récemment ajoutées ou modifiées en premier) ;
  • popularité : trie la liste par popularité (les familles les plus populaires en premier)
  • style: Sort the list by number of styles available (family with most styles first)
  • Tendances : trier la liste par familles dont l'utilisation est en hausse (la famille dont l'utilisation a le plus augmenté en premier)

Filtrage

Interroger une famille spécifique

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

Toutes les familles compatibles avec le sous-ensemble grec

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

Filtrer par catégorie de police

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

Optimisation

Pour récupérer les fichiers de police compressés au format woff2

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

Polices variables

Les polices variables offrent des plages de styles continues. Par défaut, une combinaison de fichiers de polices statiques est renvoyée pour les polices variables instanciées à des positions standards. Si capability=VF est défini, le fichier de police variable est renvoyé à la place des fichiers statiques, ainsi que les métadonnées de plage d'axes disponibles. Exemple :

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

Exemple de réponse :

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

Tags

Si la valeur capability=FAMILY_TAGS est définie, le champ des tags sera renseigné avec tous les tags qui se rapportent à l'ensemble de l'espace de conception de la famille.

Exemple :

{
 "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",
    "tags": [
      {
        "name": "/Expressive/Business",
        "weight": 58
      },
      {
        "tag": "/Sans/Humanist",
        "weight": 100,
      }
    ]
  },
  [...]
 ]
}

Spécification de l'URL de l'API

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

your_key : votre clé API de développeur.

family : nom d'une famille de polices.

subset : nom d'un sous-ensemble de police.

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

capability : VF | WOFF2.

sort : alpha | date | popularity | style | trending.