424

私は@font-face自分の会社のサイトで使用していますが、動作/見栄えがします。FirefoxとChromeを除いて、.woffファイルに404エラーがスローされます。IEはエラーをスローしません。私はルートにフォントを配置していますが、cssフォルダー内のフォントを試してみましたが、フォントのURL全体を指定することもできました。これらのフォントをcssファイルから削除すると、404が取得されないため、構文エラーではないことがわかります。

また、fontsquirrelsツールを使用して@font-faceフォントとコードを作成しました。

@font-face {
  font-family: 'LaurenCBrownRegular';
  src: url('/laurencb-webfont.eot');
  src: local('☺'), 
    url('/laurencb-webfont.woff') format('woff'), 
    url('/laurencb-webfont.ttf') format('truetype'), 
    url('/laurencb-webfont.svg#webfontaaFhOfws') format('svg');
  font-weight: normal;
  font-style: normal;
}

@font-face {
  font-family: 'FontinSansRegular';
  src: url('/fontin_sans_r_45b-webfont.eot');
  src: local('☺'), 
    url('/fontin_sans_r_45b-webfont.woff') format('woff'), 
    url('/fontin_sans_r_45b-webfont.ttf') format('truetype'), 
    url('/fontin_sans_r_45b-webfont.svg#webfontKJHTwWCi') format('svg');
  font-weight: normal;
  font-style: normal;
}
4

14 に答える 14

726

私はこれと同じ症状(Chromeのwoffファイルで404)を経験し、IIS6を搭載したWindowsServerでアプリケーションを実行していました。

同じ状況にある場合は、次のようにして修正できます。

解決策1

「IISマネージャー(Webサイトプロパティの[HTTPヘッダー]タブ)を使用して、次のMIMEタイプ宣言を追加するだけです。.woffapplication / x-woff "

更新:woffフォントGrsmtoのMIMEタイプによると、実際のMIMEタイプはapplication / x-font-woffです(少なくともChromeの場合)。x-woffはChrome404を修正し、x-font-woffはChromeの警告を修正します。

2017年現在:Woffフォントは、RFC8081仕様の一部としてmimeタイプfont/woffおよびに標準化されていfont/woff2ます。

IIS6MIMEタイプ

Seb Dugganに感謝します:http ://sebduggan.com/posts/serving-web-fonts-from-iis

解決策2

Web構成にMIMEタイプを追加することもできます。

  <system.webServer>
    <staticContent>
      <remove fileExtension=".woff" /> <!-- In case IIS already has this mime type -->
      <mimeMap fileExtension=".woff" mimeType="font/woff" />
    </staticContent>    
  </system.webServer>
于 2011-09-10T20:51:15.927 に答える
55

この投稿への回答は非常に役に立ち、時間を大幅に節約できました。ただし、を使用する場合は、以下に示すように、拡張機能のタイプのFontAwesome 4.50構成を追加する必要があることがわかりました。そうしないと、タイプのリクエストにより、Chromeのデベロッパーツールの[コンソール]>[エラー]で404エラーが発生していました。woff2woff2

S.Serpのコメントによると、以下の構成を<system.webServer>タグ内に配置する必要があります。

<staticContent>
  <remove fileExtension=".woff" />
  <!-- In case IIS already has this mime type -->
  <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
  <remove fileExtension=".woff2" />
  <!-- In case IIS already has this mime type -->
  <mimeMap fileExtension=".woff2" mimeType="application/x-font-woff2" />
</staticContent>
于 2015-11-23T16:54:53.570 に答える
44

実際には、@ Ian Robinsonの回答はうまく機能しますが、Chromeは引き続きそのメッセージに文句を言います:「リソースはフォントとして解釈されますが、MIMEタイプapplication/x-woffで転送されます

あなたがそれを得るならば、あなたはから変えることができます

アプリケーション/x-woff

application / x -font -woff

Chromeコンソールエラーはもう発生しません!

(Chrome 17でテスト済み)

于 2012-02-28T14:58:58.247 に答える
15

IIS7のソリューション

私も同じ問題に遭遇しました。この構成はすべてのWebサイトに適用されるため、サーバーレベルから行う方がよいと思います。

  1. IISルートノードに移動し、[MIMEタイプ]構成オプションをダブルクリックします

  2. 右上の[アクション]パネルで[追加]リンクをクリックします。

  3. これにより、ダイアログが表示されます。.woffファイル拡張子を追加し、対応するMIMEタイプとして「application/x-font-woff」を指定します。

.woffファイル名拡張子のMIMEタイプを追加します

MIMEタイプに移動します

MIMEタイプを追加する

これがIIS7の問題を解決するために私がしたことです

于 2014-01-10T10:28:19.300 に答える
10

Ianの答えに加えて、リクエストフィルタリングモジュールのフォント拡張機能を機能させる必要がありました。

<system.webServer>
  <staticContent>
    <remove fileExtension=".woff" />
    <remove fileExtension=".woff2" />
    <mimeMap fileExtension=".woff" mimeType="application/x-font-woff" />
    <mimeMap fileExtension=".woff2" mimeType="application/x-font-woff" />
  </staticContent>
  <security>
      <requestFiltering>
          <fileExtensions>
              <add fileExtension=".woff" allowed="true" />
              <add fileExtension=".ttf" allowed="true" />
              <add fileExtension=".woff2" allowed="true" />
          </fileExtensions>
      </requestFiltering>
  </security>    
</system.webServer>
于 2015-12-02T09:16:10.227 に答える
8

IISサーバーマネージャーを実行します(コマンドを実行:inetmgr)Mimeタイプを開き、以下を追加します

ファイル名拡張子: .woff

MIMEタイプ:application / octet-stream

于 2014-11-11T08:39:36.387 に答える
1

アクセス許可やmimeタイプなどについて多くのことを試しましたが、結局、web.configがIISの静的ファイルハンドラーを削除し、静的ファイルが含まれるディレクトリに明示的に追加し直しました。ディレクトリのロケーションノードを追加してハンドラーを追加し直すとすぐに、リクエストは404の取得を停止しました。

于 2014-11-11T15:36:44.763 に答える
1

IIS7でCodeIgniterを使用している場合:

web.configファイルで、パターンにwoffを追加します

<rule name="Rewrite CI Index">
  <match url=".*" />
    <conditions>
      <add input="{REQUEST_FILENAME}" pattern="css|js|jpg|jpeg|png|gif|ico|htm|html|woff" negate="true" />
    </conditions>
    <action type="Rewrite" url="index.php/{R:0}" />
 </rule>

それが役に立てば幸い !

于 2015-03-03T13:12:50.203 に答える
0

これは明らかかもしれませんが、404で何度もつまずきました...フォントフォルダのアクセス許可が正しく設定されていることを確認してください。

于 2011-11-19T18:24:25.593 に答える
0

URLリライターも確認してください。「奇妙な」何かが見つかった場合、404をスローする可能性があります。

于 2012-03-29T11:03:26.783 に答える
0

Webサーバー構成にアクセスできない場合は、フォントファイルの名前を変更してsvgで終わるようにすることもできます(ただし、形式は保持します)。ChromeとFirefoxで問題なく動作します。

于 2015-02-19T11:30:38.387 に答える
0

MIMEタイプを追加しても機能しない場合は、サイトの[認証]セクションで[匿名認証]が有効になっているかどうかを確認し、所定のスクリーンショットに従って[アプリケーションプールID]を選択してください。

ここに画像の説明を入力してください

于 2017-05-09T11:05:48.427 に答える
-1

解決しました:

Mo'Bulletprooferメソッドを使用する必要がありました

于 2010-10-25T15:27:44.177 に答える
-1

IIS Mimeタイプ:.woff font / x-woff(application/x-woffまたはapplication/x-font-woffではありません)

于 2015-06-05T13:33:36.773 に答える