it-swarm.com.de

wie kann ich Schriften von Chrome-Entwicklertools herunterladen/extrahieren?

Ich habe viele Dinge müde, aber ich kann es nicht bekommen, obwohl mein Computer es hat.

Wie kann ich auf diese wont-Dateien zugreifen? Sie haben die Erweiterung .woff. Ein Doppelklick auf sie in Chrome Inspector führt nur zu etwas URL. Was nicht funktioniert 

Diese Schriftart ist auch nicht auf meinem Computer installiert. 

Dies ist tatsächlich das erste Mal in meinem Leben, dass ich auf das Woff-Format und das Konzept des Web Open-Formats gestoßen bin. Ich möchte die Schriftart herunterladen, die von der Website verwendet wird. Ich weiß, ich kann die Bilder herunterladen, warum nicht. 

enter image description here

33
Muhammad Umer

Klicken Sie mit der rechten Maustaste und dann auf "Link in neuem Tab öffnen".

edit: Sie können auch doppelklicken, es hat den gleichen Effekt

18

Um .woff - Schriftarten zu erhalten, öffnen Sie zunächst das Chrome Dev Tools-Bedienfeld (Ctrl+Shift+i). Gehen Sie zu Network und laden Sie die Seite neu. Dort sehen Sie alles, was von der Seite heruntergeladen wird. Suchen Sie die .woff-Datei, Rechtsklick und wählen Sie Antwort kopieren .

Die Antwort wird eine URL sein, also in die Navigationsleiste einfügen . Es wird eine Datei heruntergeladen. Fügen Sie einfach die Erweiterung .woffund voila hinzu.

41

Es ist einfach (nur für Chorme)

  1. Rechtsklick> Element inspizieren
  2. Gehen Sie zur Registerkarte "Ressourcen" und suchen Sie nach "Schriftarten" in den Dropdown-Ordnern
    • Die Registerkarte "Ressourcen" kann als "Anwendung" bezeichnet werden.
  3. Klicken Sie mit der rechten Maustaste auf Schriftart (im .woff-Format)> Link in neuem Tab öffnen (dies sollte die Schriftart im .woff-Format herunterladen
  4. Finden Sie online einen Zeichensatzkonverter 'Woff in TTF oder Otf'
  5. Viel Spaß nach dem Umbau! 
3
Utkarsh

Wenn Sie ein unixoides Betriebssystem verwenden und nur eine einzige Datei extrahieren möchten, können Sie Folgendes versuchen. Die Struktur der chrome://cache-Seiten besteht aus URL, analysiertem HTTP-Header, Hex-Dump des HTTP-Headers und dann Hex-Dump der Nutzdaten.

Um eine Datei zu extrahieren, kopieren Sie alle Payload-Zeilen aus einer Chrome-Cache-Seite in die Zwischenablage (beginnend bei der zweiten 00000000: ...-Zeile), fügen Sie sie in einen Texteditor ein und speichern Sie sie als reine Textdatei (z. B. file.txt). Wenn es sich bei der Nutzlast um eine gzipierte WOFF-Datei handelt, verwenden Sie xxd -r file.txt > file.woff.gz, um sie zurück in eine Binärdatei zu konvertieren, und gunzip file.woff.gz für die Dekomprimierung.

Sie können dann woff2otf verwenden, um WOFF-Dateien in das OTF-Format zu konvertieren, oder woff2 , um WOFF 2.0-Dateien in das TTF-Format zu konvertieren. Für die Stapelverarbeitung sollte dieser Workflow offensichtlich in einem Skript ausgeführt werden.

2
Stefan Schmidt

Chrom öffnen 

Klicken Sie mit der rechten Maustaste => inspect => navigieren Sie zu application tab

Im Abschnitt Frames werden alle statisch verfügbaren Assets (Ressourcen) wie css, JavaScript und Schriftarten aufgelistet.

1
Jineesh

Ich fand die Chrome-Option in Ordnung, aber es gibt einige Schritte, um zu den Schriftdateien zu gelangen. Sobald Sie dort sind, ist das Herunterladen sehr einfach. Ich verwende normalerweise die Dev-Tools in Safari, da weniger Schritte erforderlich sind. Gehen Sie einfach zu der gewünschten Seite, klicken Sie im Entwickler-Menü auf "Seitenquelle anzeigen" oder "Seitenressourcen anzeigen" (beide funktionieren dafür), und die Seitenressourcen werden in Ordnern auf der linken Seite aufgelistet. Klicken Sie auf den Schriftartenordner und die Schriftarten werden aufgelistet. Klicken Sie mit der rechten Maustaste und speichern Sie die Datei. Wenn Sie viele Zeichensatzdateien von einer Website herunterladen, ist es möglicherweise schneller, sich auf dem Weg von Chrome zu arbeiten, da das Öffnen der Registerkarten die Schriftarten schneller lädt. Wenn Sie eine oder zwei Zeichensätze von vielen verschiedenen Websites verwenden, ist Safari insgesamt schneller.

1
David

Obwohl die Lösung von Marcelo anscheinend gut funktioniert, müssen Sie die Schriftart möglicherweise gar nicht herunterladen! Einfach per Fernzugriff darauf zugreifen .

Zum Beispiel wird die Schrift auf example.com gehostet

@font-face {
  font-family: "Font Name";
  font-style: normal;
  src: url(http://example.com/webfonts/font-name.woff);
}

Sie können die direkte URL der Schriftart leicht herausfinden, indem Sie in css code von example.com nachsehen, wie sie die Datei verknüpfen.

0
ttvd94