web-dev-qa-db-ja.com

WOFFフォントのMIMEタイプは？

WOFFフォントはどのようなMIMEタイプを提供すべきですか？

TrueType（ttf）フォントをfont/truetype、opentype（otf）をfont/opentypeとして提供していますが、WOFFフォントの正しい形式が見つかりません。

私はfont/woff、font/webopen、そしてfont/webopentypeを試しましたが、それでもChromeは文句を言います：

「リソースはフォントとして解釈されましたが、MIMEタイプapplication/octet-streamで転送されました。」

誰か知ってる？

embedded-fontswoff
538
Nico Burns

Keith Shawさんのコメント からの更新日：2017年6月22日：

2017年2月現在、 RFC8081 が提案されている標準です。これはフォントの最上位メディアタイプを定義しているため、WOFFとWOFF2の標準メディアタイプは次のとおりです。

font/woff

font/woff2

2011年1月に 発表されました その間にChromiumは認識するでしょう

application/x-font-woff

wOFFのMIMEタイプとして。私はこの変更がChromeベータ版に入っていることを知っています、そしてまだ安定していなければ、それはそれほど遠く離れてはいけません。

721
Marcel

私にとっては、次は.htaccessファイルで作業しています。

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff
AddType font/woff2 .woff2
130
joiggama

それはapplication/font-woffになります。

http://www.w3.org/TR/WOFF/#appendix-b を参照してください（/ W3C勧告候補2011年8月4日）

そして http://www.w3.org/2002/06/registering-mediatype.html

Mozilla cssフォントフェイスノートから

Geckoでは、Webフォントは、HTTPアクセス制御を使用してこの制限を緩和しない限り、同じドメイン制限が適用されます（フォントファイルはそれらを使用するページと同じドメインにある必要があります）。注：TrueType、OpenType、およびWOFFフォントには定義済みのMIMEタイプがないため、指定されたファイルのMIMEタイプは考慮されません。

ソース： https://developer.mozilla.org/en/CSS/@font-face#Notes

56
jflaflamme

フォントMIMEタイプを.NET/IISに追加するための参照

web.configを介して 

<system.webServer>
  <staticContent>
     <!-- remove first in case they are defined in IIS already, which would cause a runtime error -->
     <remove fileExtension=".woff" />
     <remove fileExtension=".woff2" />
     <mimeMap fileExtension=".woff" mimeType="application/font-woff" />
     <mimeMap fileExtension=".woff2" mimeType="application/font-woff2" />
  </staticContent>
</system.webServer>

経由IISマネージャ

screenshot of adding woff mime types to IIS

23
JeremyWeir

NGINX SOLUTION

ファイル

/etc/nginx/mime.types

または

/usr/local/nginx/conf/mime.types

追加する

font/ttf                      ttf;
font/opentype                 otf;
font/woff                     woff;
font/woff2                    woff2;
application/vnd.ms-fontobject eot;

削除する

application/octet-stream        eot;

_参照_

RFC @ 02.2017

https://tools.ietf.org/html/rfc8081#page-15

https://www.iana.org/assignments/media-types/media-types.xhtml

Mike Fulcherに感謝します

http://drawingablank.me/blog/font-mime-types-in-nginx.html

21
BG Bruno

2017年2月現在、 RFC8081 が提案されている標準です。これはフォントの最上位メディアタイプを定義しているため、WOFFとWOFF2の標準メディアタイプは次のとおりです。

font/woff
font/woff2
17
Keith Shaw

font MIMEタイプはありません。したがって、font/xxxは常に間違っています。

12
K. Rice

@Nico 、

現時点では、woffフォントのMIMEタイプの定義された標準はありません。私はfont delivery cdnサービスを使い、それはfont/woffを使います、そして私はクロムで同じ警告を得ます。

参照： インターネット割り当て番号局

6
Chris_O

私のためにそれをやったことは私のmime_types.rb初期化子にこれを追加することでした：

Rack::Mime::MIME_TYPES['.woff'] = 'font/woff'

および キャッシュを消去します

rake tmp:cache:clear

サーバーを再起動する前に。

ソース： https://github.com/sstephenson/sprockets/issues/366#issuecomment-9085509

5
Stewie

あなたの.htaccessに以下を追加してください

AddType font/woff woff

がんばろう

4
Nick321

多分これは誰かを助けるでしょう。私はIIS 7 .ttfがすでに知られているMIMEタイプであることを見ました。それは以下のように構成されています。

application/octet-stream

だから私はちょうどすべてのCSSフォントタイプ（.oet、.svg、.ttf、.woff）とIISにそれらを供給し始めたことを加えました。 Chrome開発ツールは、型の再解釈について不平を言うこともありません。

乾杯、マイケル

3
Michael Kennedy

WOFF：

  1. Web Openフォントフォーマット
  2. TrueTypeまたはPostScript（CFF）のいずれかのアウトラインでコンパイルできます。
  3. 現在FireFox 3.6以降でサポートされています

それを追加してみてください。

AddType application/vnd.ms-fontobject .eot
AddType application/octet-stream .otf .ttf
2
Adalarasan Sachithanantham

すべての解決策index.phpについてフォームurlおよびwoffファイルの削除を許可しました。以下のコードを.htaccessファイルに書いて、application/config/config.phpファイルに書き換えてください。$ config ['index_page'] = '';

Linuxホスティングサーバー専用。 .htaccessファイルの詳細 

AddType font/ttf .ttf
AddType font/eot .eot
AddType font/otf .otf
AddType font/woff .woff
<IfModule mod_rewrite.c>
    RewriteEngine On
    RewriteBase /

    #Removes access to the system folder by users.
    #Additionally this will allow you to create a System.php controller,
    #previously this would not have been possible.
    #'system' can be replaced if you have renamed your system folder.
    RewriteCond %{REQUEST_URI} ^system.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #When your application folder isn't in the system folder
    #This snippet prevents user access to the application folder
    #Submitted by: Fabdrol
    #Rename 'application' to your applications folder name.
    RewriteCond %{REQUEST_URI} ^application.*
    RewriteRule ^(.*)$ /index.php?/$1 [L]

    #Checks to see if the user is attempting to access a valid file,
    #such as an image or css document, if this isn't true it sends the
    #request to index.php
    RewriteCond %{REQUEST_FILENAME} !-f
    RewriteCond %{REQUEST_FILENAME} !-d
    RewriteRule ^(.*)$ index.php?/$1 [L]
</IfModule>

<IfModule !mod_rewrite.c>
    # If we don't have mod_rewrite installed, all 404's
    # can be sent to index.php, and everything works as normal.
    # Submitted by: ElliotHaughin

    ErrorDocument 404 /index.php
</IfModule>
1
Hussy Borad

https://developer.mozilla.org/en-US/docs/Web/HTTP/Basics_of_HTTP/MIME_types/Complete_list_of_MIME_types

これはmimetypesの役に立つリストです

1
Mike Hague

私はこの記事が古くなっていることを知っていますが、nginxのローカルマシンでフォントを機能させるために何時間も費やし、たくさんの解決策を試してみると、ついに魅力的なものになりました。

location ~* \.(eot|otf|ttf|woff|woff2)$ {
    add_header Access-Control-Allow-Origin *;
}

括弧の中にあなたのフォントの拡張子や一般的にあなたがロードしたいファイルを置くことができます。たとえば、フォントや画像（png、jpgなど）にも使用したので、この解決方法はフォントにのみ適用されることに混乱しないでください。

Nginxの設定ファイルに入れて再起動してください。

1
pr1nc3

IISは自動的に.ttfをapplication/octet-streamとして定義しましたが、これは問題なく動作するようです。fontshopでは、.woffをapplication/octet-streamとして定義することを推奨しています。

1
needletooth

MIMEタイプがあなたの唯一の問題ではないかもしれません。フォントファイルがS3または他のドメインでホストされている場合は、Firefoxが異なるドメインからフォントをロードしないという問題があるかもしれません。これはApacheでの簡単な修正ですが、Nginxでは、あなたはあなたのフォントファイルをbase-64でエンコードしてあなたのフォントcssファイルに直接埋め込む必要があるかもしれないと読みました。

0
Ringo

私は同じ問題を抱えている、 font/opentype 私のために働いた

0
oshimin