Google ostrzeżenie: Zasobami interpretowane jako Font ale przeniesione z aplikacji typu MIME/oktet strumienia

Question

mam ostrzeżenie w Google dla mojej font-face:

zasobów interpretować jako Font ale przeniesione z aplikacji typu MIME/octet- stream: ".../Content/Fonts/iconFont.ttf".

Działa, nawet jeśli mam to ostrzeżenie, ale wolę unikać tego ostrzeżenia.

Oto moja deklaracja:

@font-face { 
    font-family: 'iconFont'; 
    src: url('../Fonts/iconFont.eot?#iefix') format('embedded-opentype'), 
    url('../Fonts/iconFont.svg#iconFont') format('image/svg+xml'), 
    url('../Fonts/iconFont.woff') format('font/x-woff'), 
    url('../Fonts/iconFont.ttf') format('truetype'); 
    font-weight: normal; 
    font-style: normal; 
} 

już szukać na innych stanowiskach, ale nie ma szczęścia do tej pory.

Należy zauważyć, że moim serwerem jest IIS firmy Microsoft.

Każdy pomysł, jak mogę uniknąć tego ostrzeżenia?

Dzięki.

Answer 1

inne podejście tutaj: http://zduck.com/2013/google-chrome-and-woff-font-mime-type-warnings/

użycie poniżej ustawień na internecie.config:

<system.webServer> 
<staticContent> 
    <mimeMap fileExtension=".woff" mimeType="application/font-woff"/> 
</staticContent> 
</system.webServer> 

Answer 2

Trzeba dodać następujące typy do .htaccess/IIS:

AddType application/vnd.ms-fontobject .eot 
AddType font/ttf .ttf 
AddType font/otf .otf 
AddType application/font-woff .woff 

Zaktualizowany typ .woff od:

AddType application/x-font-woff .woff 

(dzięki @renadeen w komentarzach poniżej, wskazując to na zewnątrz.)

Sprawdź moją odpowiedź na podobne pytanie tutaj: Font Face not loaded

Zrobione stąd: font-face problem in chrome.

Answer 3

Dziękuję za powyższą odpowiedź @ 97ldave, możesz dodać te typy do sekcji konfiguracji serwera IIS webServer, jeśli nie chcesz dodawać ich bezpośrednio do typów MIME w konfiguracji usług IIS. Poniżej przedstawiono przykład dodania tylko typu .woff, którego brakowało w naszej konfiguracji. Naprawiono problemy z czcionkami, które nie pojawiły się w najnowszej wersji Safari (6.0.3) na moim iMacu.

<system.webServer> 
<staticContent> 
    <remove fileExtension=".woff" /> 
    <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" /> 
</staticContent> 
</system.webServer> 

Dziękuję Jonowi Samwellowi (mojemu koledze) za znalezienie tego.

Answer 4

Dla Nginx: (Ścieżka: /etc/nginx/mime.types)

font/ttf       ttf; 
font/otf       otf; 
application/x-font-woff   woff; 

Nie trzeba application/vnd.ms-fontobject eot; ponieważ już istnieje.

Po tym restart Nginx: service nginx restart

zrobić.

Answer 5

Poprawne typy MIME dla czcionek to:

application/font-ttf    ttf; 
application/font-otf    otf; 
application/font-woff    woff; 

Answer 6

Jeśli prowadzisz serwer z nodeJS, jest to miły moduł mapowania typów MIME

https://github.com/broofa/node-mime

var mime = require('mime'); 

mime.lookup('/path/to/file.txt');   // => 'text/plain' 
mime.lookup('file.txt');     // => 'text/plain' 
mime.lookup('.TXT');      // => 'text/plain' 
mime.lookup('htm');      // => 'text/html' 

mime.extension('text/html');     // => 'html' 
mime.extension('application/octet-stream'); // => 'bin' 

Answer 7

Dzięki @ the-senator i @ 97ldave za ich odpowiedzi

dla mnie błąd całkowicie zniknąć zaraz po dodaniu te linie do pliku web.config

<system.webServer> 
<staticContent> 
     <remove fileExtension=".woff" /> 
     <mimeMap fileExtension=".woff" mimeType="application/x-font" /> 
     <remove fileExtension=".woff2" /> 
     <mimeMap fileExtension=".woff2" mimeType="application/x-font" /> 
    </staticContent> 
</system.webServer>