Warum kann ich mit @font-face keine Schriftarten von einer externen Domäne in Firefox laden?

CSS @font-face Absolute URL von einer externen Domain: Beheben von Problemen beim Laden von Schriftarten in Firefox

In einem Versuch, einen Store-Bereich zu entwickeln Bei Shopify ist ein Benutzer auf ein Problem gestoßen, als Schriftarten, die auf einem separaten Pagodabox-Server gehostet wurden, in Firefox-Version 13.0.1 nicht geladen werden konnten. Ihr CSS verwendete absolute URLs, um auf die Schriftarten zu verweisen, und sie suchten Hilfe, um die Ursache des Problems zu ermitteln.

Firefox erzwingt Sicherheitsmaßnahmen, die das Laden von Schriftarten aus externen Domänen mithilfe von @font-face einschränken. Wenn sich die Schriftartquelle auf einem anderen Server befindet, muss sie von Zugriffskontrollheadern begleitet werden, insbesondere vom Access-Control-Allow-Origin-Header, der entweder auf „*“ oder die autorisierten Domänen gesetzt ist.

Um dieses Problem zu beheben Bei diesem Problem besteht die Lösung darin, Apache-Konfigurationen zur .htaccess-Datei hinzuzufügen und den Server neu zu starten. Hier ist ein Beispiel:

AddType application/vnd.ms-fontobject .eot
AddType font/ttf .ttf
AddType font/otf .otf
<FilesMatch "\.(ttf|otf|eot)$">
<IfModule mod_headers.c>
Header set Access-Control-Allow-Origin "*"
</IfModule>
</FilesMatch>

Durch Hinzufügen der angegebenen Konfigurationen zur .htaccess-Datei erkennt Firefox die Access Control Header und ermöglicht das erfolgreiche Laden der auf der externen Pagodabox-Domäne gehosteten Schriftarten.

Das obige ist der detaillierte Inhalt vonWarum kann ich mit @font-face keine Schriftarten von einer externen Domäne in Firefox laden?. Für weitere Informationen folgen Sie bitte anderen verwandten Artikeln auf der PHP chinesischen Website!