API para desarrolladores

La API de Developer brinda acceso a los metadatos de todas las familias en las que se publica de Google Fonts. Permite que las apps consulten Google Fonts para las familias de fuentes disponibles. El La API de REST proporciona datos en el formato JSON que incluyen los estilos y las secuencias de comandos (llamados subconjuntos en Google Fonts) en cada familia. La API puede ordenar la lista de familias alfabéticamente, por fecha de adición, por número de estilos, por tendencia o por popularidad.

Público

Este documento está dirigido a desarrolladores web y de aplicaciones. Con el La API para desarrolladores requiere conocimientos de JavaScript.

Ejemplo rápido:

Para recuperar la lista dinámica de fuentes que ofrece el servicio Google Fonts, envía la siguiente solicitud:

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

Una muestra del resultado se vería de la siguiente manera:

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

Cómo identificar tu aplicación en Google

Tu aplicación necesita identificarse cada vez que envía una solicitud a la API de Google Fonts Developer, incluyendo una clave de API con cada para cada solicitud.

Adquiere y usa una clave de API

Obtén una clave

También puedes crear una en la página Credenciales.

Una vez que tienes una clave de API, puedes usar tu aplicación para adjuntar el parámetro de consulta key=yourAPIKey a todas las URL de solicitud.

La clave de API en las URL se incorpora de manera segura, por lo que no necesita codificación.

Detalles

La respuesta JSON (consulta el ejemplo anterior) se compone de un array llamado “items” que contiene objetos con información sobre cada familia de fuentes.

Un objeto de familia consta de los siguientes campos:

  • similar: el tipo de objeto; un objeto de la fuente para sitios web
  • familia: el nombre de la familia
  • subconjuntos: Una lista de secuencias de comandos compatibles con la familia
  • Menu: Una URL al subconjunto familiar que cubre solo el nombre de la familia.
  • variantes: Los diferentes estilos disponibles para la familia
  • version: Corresponde a la versión de la familia de fuentes.
  • ejes: rango de eje, solo presente a pedido(ver a continuación) para fuentes variables
  • lastModified: Es la fecha (formato "aaaa-MM-dd") para la que se modificó la familia de fuentes. la última vez.
  • files: Los archivos de la familia de fuentes (con todas las secuencias de comandos compatibles) para cada uno de los variantes disponibles.

Al combinar la información de cada familia, es fácil crear una API de Fonts para cada solicitud. Por ejemplo, suponiendo que tenemos una referencia al objeto family para Profesional anónimo:

[...]

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('');

[...]

Ordenar

De forma predeterminada, la lista de familias no se muestra con un orden particular. Sí sin embargo, es posible ordenar la lista mediante el parámetro de ordenación:

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

Estos son los posibles valores de ordenación:

  • alpha: Ordenar la lista alfabéticamente
  • date: Ordena la lista por fecha en que se agregó (la fuente más reciente se agregó o actualizó primero).
  • Popularidad: Ordena la lista por popularidad (los más populares primero para las familias).
  • style: ordena la lista por el número de estilos disponibles (familia con la mayoría de los estilos). primero)
  • tendencia: Ordena la lista por familias que ven un aumento en el uso (familia que más crecimiento primero)

Filtros

Consultar una familia específica

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

Todas las familias que admiten el subconjunto griego

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

Optimización

Para recuperar archivos de fuentes comprimidos en formato woff2

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

Fuentes variables

Las fuentes variables ofrecen rangos continuos de estilos. De forma predeterminada, una combinación de Los archivos de fuentes estáticas se muestran para las fuentes variables que se crearon en la instancia estándar posiciones. Si estableces capability=VF, se muestra el archivo de fuente variable en lugar de estático. junto con los metadatos del rango de ejes disponibles. ejemplo de muestra:

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

Respuesta de muestra:

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

Especificación de la URL de la API

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

your_key: Es tu clave de API de desarrollador.

family: Es el nombre de una familia de fuentes.

subset: Nombre de un subconjunto de fuentes.

capability: VF | WOFF2

sort: alpha | date popularity style | trending