[ Web Proxy ]
URL:
Viewing: https://developer.mozilla.org/zh-CN/docs/Web/API/Local_Font_Access_API [Back]  [Original]

Local Font Access API - Web API | MDN

MDN Web Docs

View in English Always switch to English

Local Font Access API

Want more browser support for this feature? Tell us why.

:

Local Font Access API

Web Web Web Web @font-face at Web url() URL

@font-face local() Postscript local()

Web

Local Font Access API

Window.queryLocalFonts() FontData FontData blob() Blob

FontData

Window.queryLocalFonts()

Promise FontData

js
if ("queryLocalFonts" in window) {
  //  API
}

js
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 PostScriptTrueTypeOpenType Web WOFF

js
async function computeOutlineFormat() {
  try {
    const availableFonts = await window.queryLocalFonts({
      postscriptNames: ["ComicSansMS"],
    });
    for (const fontData of availableFonts) {
      // `blob()`  SFNT  Blob
      const sfnt = await fontData.blob();
      //  4  SFNT 
      // https://learn.microsoft.com/zh-cn/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("", outlineFormat);
    }
  } catch (err) {
    console.error(err.name, err.message);
  }
}

Local Font Access API


Web Proxy Viewer  |  New URL  |  Original Page