Spec-Zone.ru › Web APIs

FontData

Ограниченная доступность

Эта функция не является базовой, поскольку она не работает в некоторых из самых широко используемых браузеров.

  • Подробнее
  • Полная совместимость
  • Отправить отзыв

Экспериментальный: Это экспериментальная технология
Перед использованием в рабочей среде внимательно изучите таблицу совместимости браузеров.

Интерфейс FontData API локального доступа к шрифтам представляет собой отдельный локальный шрифт.

Свойства экземпляра

FontData.family Только для чтения Экспериментально

Возвращает семейство шрифтов.

FontData.fullName Только для чтения Экспериментально

Возвращает полное имя шрифта.

FontData.postscriptName Только для чтения Экспериментально

Возвращает имя шрифта PostScript.

FontData.style Только для чтения Экспериментально

Возвращает стиль шрифта.

Методы экземпляра

FontData.blob() Экспериментально

Возвращает Promise, который выполняется с Blob, содержащим исходные байты файла шрифта.

Примеры

Для демонстрации, работающей в реальном времени, см. Демонстрацию выбора шрифта.

Перечисление шрифтов

Следующий фрагмент запросит все доступные шрифты и выведет метаданные. Это можно использовать, например, для заполнения элемента управления выбором шрифтов.

async function logFontData() {
  try {
    const availableFonts = await window.queryLocalFonts();
    for (const fontData of availableFonts) {
      console.log(fontData.postscriptName);
      console.log(fontData.fullName);
      console.log(fontData.family);
      console.log(fontData.style);
    }
  } catch (err) {
    console.error(err.name, err.message);
  }
}

Доступ к данным низкого уровня

Метод blob() предоставляет доступ к данным низкого уровня SFNT — это формат файла шрифта, который может содержать другие форматы шрифтов, такие как PostScript, TrueType, OpenType или Web Open Font Format (WOFF).

async function computeOutlineFormat() {
  try {
    const availableFonts = await window.queryLocalFonts({
      postscriptNames: ["ComicSansMS"],
    });
    for (const fontData of availableFonts) {
      // `blob()` returns a Blob containing valid and complete
      // SFNT-wrapped font data.
      const sfnt = await fontData.blob();
      // Slice out only the bytes we need: the first 4 bytes are the SFNT
      // version info.
      // Spec: https://learn.microsoft.com/en-us/typography/opentype/spec/otff#organization-of-an-opentype-font
      const sfntVersion = await sfnt.slice(0, 4).text();

      let outlineFormat = "UNKNOWN";
      switch (sfntVersion) {
        case "\x00\x01\x00\x00":
        case "true":
        case "typ1":
          outlineFormat = "truetype";
          break;
        case "OTTO":
          outlineFormat = "cff";
          break;
      }
      console.log("Outline format:", outlineFormat);
    }
  } catch (err) {
    console.error(err.name, err.message);
  }
}

Спецификации

Спецификация
API локального доступа к шрифтам
# fontdata-interface

Совместимость браузеров

Рабочий стол Мобильные устройства
Chrome Edge Firefox Opera Safari Chrome Android Firefox для Android Opera Android Safari на iOS Samsung Internet WebView Android
FontData 103 103 Нет Нет Нет Нет Нет Нет Нет Нет Нет
blob 103 103 Нет Нет Нет Нет Нет Нет Нет Нет Нет
family 103 103 Нет Нет Нет Нет Нет Нет Нет Нет Нет
fullName 103 103 Нет Нет Нет Нет Нет Нет Нет Нет Нет
postscriptName 103 103 Нет Нет Нет Нет Нет Нет Нет Нет Нет
style 103 103 Нет Нет Нет Нет Нет Нет Нет Нет Нет

См. также

  • Использование улучшенной типографики с локальными шрифтами
  • @font-face

© 2005–2024 MDN contributors.
Licensed under the Creative Commons Attribution-ShareAlike License v2.5 or later.
https://developer.mozilla.org/en-US/docs/Web/API/FontData

Spec-Zone.ru

Настройки Оффлайн Что нового Помощь О нас
Spec-Zone .ru
спецификации, руководства, описания, API