Home - News ( United States | United Kingdom | Italy | Germany ) - Football scores

Showing content from https://developer.cdn.mozilla.net/de/docs/Web/API/Local_Font_Access_API below:

Local Font Access API - Web-APIs

Limited availability

Experimentell: Dies ist eine experimentelle Technologie
Überprüfen Sie die Browser-Kompatibilitätstabelle sorgfältig vor der Verwendung auf produktiven Webseiten.

Die Local Font Access API bietet einen Mechanismus, um auf die lokal installierten Schriftartdaten des Benutzers zuzugreifen — dazu gehören höhere Details wie Namen, Stile und Familien sowie die Rohdaten der zugrunde liegenden Schriftartdateien.

Webfonts waren revolutionär, indem sie Typografie im Web ermöglichten, da sie Webdesignern erlauben, benutzerdefinierte Schriften bereitzustellen, die in einem Webdokument verwendet werden können. Angegeben über die @font-face-Regel, kann ein Webfont von einer in der url()-Funktion bereitgestellten URL geladen werden.

@font-face hat mehrere andere nützliche Funktionen. Insbesondere können Sie den vollständigen Namen oder Postscript-Namen der Schriftart in der Funktion local() angeben, um dem Browser mitzuteilen, dass er eine lokale Kopie verwenden soll, wenn der Benutzer die Schriftart auf seinem Computer installiert hat. Dies ist nicht ohne Probleme — local() ist berüchtigt geworden als ein Fingerprinting-Vektor.

Darüber hinaus waren High-End-Designtools historisch schwer im Web bereitzustellen, aufgrund von Herausforderungen bei der genauen Schrifterkennung und dem Zugriff auf niedere Schriftartdaten (zum Beispiel, um Filter und Transformationen anzuwenden). Aktuelle Apps verlassen sich oft auf Workarounds, wie zum Beispiel den Benutzern zu bitten, ihre Schriftarten auf einen Server hochzuladen, wo sie verarbeitet werden, um Rohdatendaten zu erhalten, oder ein separates lokales Programm zu installieren, um zusätzliche Funktionen bereitzustellen.

Die Local Font Access API wurde erstellt, um diese Probleme zu lösen.

Die Methode Window.queryLocalFonts() bietet Zugriff auf ein Array lokal installierter Schriften, die jeweils durch eine FontData-Objektinstanz repräsentiert werden. FontData hat mehrere Eigenschaften, die Zugriff auf Namen, Stile und Familien bieten, und es hat auch eine blob()-Methode, die Zugriff auf ein Blob bietet, das die Rohdaten der zugrunde liegenden Schriftartdatei enthält.

In Bezug auf Datenschutz und Sicherheit:

• Die Local Font Access API ist so konzipiert, dass sie nur den Zugang zu den Daten bietet, die zur Lösung der oben genannten Probleme erforderlich sind. Es gibt auch keine Anforderung an Browser, die vollständige Liste der verfügbaren lokalen Schriften bereitzustellen oder die Daten in derselben Reihenfolge zu liefern, wie sie auf der Festplatte erscheinen.
• Wenn Window.queryLocalFonts() aufgerufen wird, wird der Benutzer um Erlaubnis gebeten, auf seine lokalen Schriftarten zuzugreifen. Der Status dieser Erlaubnis kann über die Permissions API abgefragt werden (die Berechtigung local-fonts).
• Sie können den Zugang zu dieser Funktion mit einer local-fonts Permissions Policy steuern.

FontData

Repräsentiert ein einzelnes lokales Schriftbild.

Window.queryLocalFonts()

Gibt ein Promise zurück, das mit einem Array von FontData-Objekten erfüllt wird, die die lokal verfügbaren Schriftbilder repräsentieren.

Für eine funktionierende Live-Demo, siehe unser Local Font Access API-Demo.

if ("queryLocalFonts" in window) {
  // The Local Font Access API is supported
}

Das folgende Snippet fragt nach allen verfügbaren Schriftarten und protokolliert Metadaten. Dies könnte verwendet werden, um beispielsweise ein Schriftarten-Auswahlsteuerung zu füllen.

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);
  }
}

Die blob()-Methode bietet Zugriff auf niedrigstufige SFNT-Daten — dies ist ein Schriftartdateiformat, das andere Schriftformate enthalten kann, wie PostScript, TrueType, OpenType oder 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);
  }
}

RetroSearch is an open source project built by @garambo | Open a GitHub Issue

Search and Browse the WWW like it's 1997 | Search results from DuckDuckGo

HTML: 3.2 | Encoding: UTF-8 | Version: 0.7.4