Ich bin mir bewusst, dass die Verwendung von @ font-face es dem Browser ermöglicht, eine benutzerdefinierte Schriftart herunterzuladen und sie wie jede Systemschriftart in einer Webseite zu verwenden.Wie funktioniert @ font-face?
Was ich wissen möchte ist, wenn der Browser die Schriftart codiert oder verwendet, ohne sie zu belichten?
Dank
Der Browser kann die Quelle der Schriftarten nicht schützen. Sobald die Informationen vom Browser empfangen werden, können Sie davon ausgehen, dass der Benutzer vollen Zugriff auf das erhält, was Sie ihm senden.
So wird das Problem, die Fonts zu sichern, entweder auf der rechtlichen Ebene (durch Auswahl von Schriften, die Einbettung ermöglicht) oder durch serverseitige Verschleierungschemata getan. Zum Beispiel, Blick auf die Schriftarten durch Typekit eingebettet:
@font-face {
font-family:"rosewood-std-fill-1";
src:url(data:font/opentype;base64,d09GRgABAAAAAEa4ABMAAAAA2XwA.....);
font-style:normal;
font-weight:400;
}
Die Schriftart durch eine Base64-Codierung Prozess verschleiert wird. Darüber hinaus ist die Schriftart in zwei Teile aufgeteilt und die Anzahl der Glyphen ist auf diejenigen beschränkt, die von der Website benötigt werden.
Auf der anderen Seite, wenn Sie FontSquirrel und Google Font API @font-face Kits betrachten, können Sie sehen, dass die eigentliche Quelle der Schriftart an den Benutzer gesendet wird - keine Verschleierung erforderlich. Zusätzlich Schriftbesitzer in irgendeiner Form Zuschreibung verlangen, wie
Wenn der font eine kostenlose Schriftart ($ 0,00 Lizenzgebühr), können Sie diese Schriftart für Font-Face-Einbettung verwenden, aber nur, wenn Sie setzen Sie einen Link www.exljbris.nl auf Ihrer Seite und/oder setzen Sie diese Mitteilung
/* A font by Jos Buivenga (exljbris) -> www.exljbris.com */in Ihrer CSS-Datei so nahe wie möglich zu dem Stück Code, der die Font-Face-Einbettung dieser erklärt Schriftart.
gesehen in this license. Aus all diesen Gründen können wir mit Sicherheit feststellen, dass das Problem der Schriftartensicherheit nicht auf der Client-Seite auftritt, sondern eher auf der Seite des Entwicklers liegt. Daher können und werden Browser nichts tun, um den Zugriff von Benutzern zu verhindern zu diesen Schriftarten.
Die base64-Kodierung ist keine Verschleierung, sie macht es überflüssig, eine zusätzliche HTTP-Anforderung für die Schriftartendatei zu erstellen, während der MIME-Typ "text/css" beibehalten wird. –
@Stan Wirklich, ich kann mir keinen anderen Grund dafür vorstellen. Typekit erlaubt nur bis zu fünf Schriftarten, so dass der HTTP-Request-Overhead nicht signifikant ist. Haben Sie irgendwelche Dokumente, um das zu sichern? ' –
* Jede * HTTP-Anfrage ist wichtig, und base64 ist eine Inhalts-Transfer-Codierung, für die jeder einen Decoder hat. Das Ziel ist keine Verschleierung - die Alternative ist eine binäre Übertragung, die nicht in das Stylesheet eingebettet werden kann. Sie können eine Anforderung für eine Schriftartdatei erzwingen, wenn Sie möchten; Typekit hat nicht gewählt. (Ich benutze die gleiche Technik für kleine, wiederholte Hintergrundbilder.) Sie haben Ihnen eine Datei gegeben, die für einen Benutzer besser zugänglich ist als eine Binärdatei (keine Suche durch den Cache, nur aus der CSS-Datei kopieren, speichern und konvertieren). –
In den meisten Fällen wird die Font-Datei in ausgesetzt, dass sie direkt von Ihrem CSS-Datei verknüpft ist, und damit jemand intelligent genug, um die Schrift herunterladen und installieren Sie sie auf ihrer Maschine. Dies ist teilweise der Grund, warum die meisten kommerziellen Fontlizenzen es verbieten, auf Websites mit @font-face verwendet zu werden. Aber es gibt Techniken, die das einschränken. Sehen Sie sich zum Beispiel die Option "Nur Web" im Font Font-Generator von Font Squirrel an.
@font-face teilt Ihrem Browser mit, wo Sie die aktuelle Schriftart herunterladen können.
Wenn zum Beispiel Google's web fonts verwenden, geben sie CSS Sie wie folgt aus:
@font-face {
font-family: 'Cantarell';
font-style: normal;
font-weight: normal;
src: local('Cantarell'), url('http://themes.googleusercontent.com/font?kit=p5ydP_uWQ5lsFzcP_XVMEw') format('truetype');
}
Wenn Sie die URL öffnen (http://themes.googleusercontent.com/font?kit=p5ydP_uWQ5lsFzcP_XVMEw) Ihr Browser die tatsächliche Truetype-Font-Datei herunterladen.
Ich habe Googles Schriftarten mit dieser Methode heruntergeladen (so haben meine Photoshop-Mock-ups die richtige Schriftart).
Was meinst du damit, es auszusetzen? –
Ziemlich gut, eigentlich. –
@Ian Devlin Mit "aussetzen" meine ich, dass ich von anderen Programmen verwendet werden darf. – hitautodestruct