web-dev-qa-db-ja.com

ライセンスされたWebフォントはどのようにレンダリングされますか?

myfonts.comのライセンスフォントが使用されているプロジェクトのソースコードを見ています。

Cssファイルにはこれが含まれています-

  /* @import must be at top of file, otherwise CSS will not work */
    @import url("//hello.myfonts.net/count/123d4d");

   @font-face {
  font-family: 'SoliPx';
  src: url('webfonts/123D4D_1_0.eot');
  src: url('webfonts/123D4D_1_0.eot?#iefix') format('embedded-opentype'),url('webfonts/123D4D_1_0.woff') format('woff'),url('webfonts/123D4D_1_0.ttf') format('truetype');
}

そして、ソースURLで述べたように、プロジェクトのローカルwebfontsフォルダーにeot、woff、ttfファイルがあります。

@ font-faceとwebfontsが一般的にどのように機能するかを知っています。

しかし、上記のライセンス/商用フォントが使用されている場合、Dev Toolsにダウンロードされたフォントファイルは表示されませんが、テキストは指定されたフォントでレンダリングされます。

ステータス200でhello.myfonts.net/count/123d4dに送信され、「text/css」の応答content-typeに送信されるネット要求がありますが、応答本文には何もありません。

内部で何が起こっていますか?これはどのように機能していますか?

23

私は以前にこれを扱ったことがあり、インポートされたファイルの機能は次のとおりです。

  1. 実際にフォントをロードする限り、何もしません。以前(テスト中)に省略しましたが、サーバーからフォントが正常に読み込まれます。

  2. これは、ファイルがCSSによってインポートされた回数をカウントします(したがって、/count/URL内)。 myfonts.com Webfontライセンスを読むと、ほとんどのWebfontには月間ページビュー上限が付いています。その上限を超えると、myfontsはアカウントに再度請求するか、上限の高い新しいライセンスを購入することを提案します。

つまり、ここに実際にあるのは、空のCSSファイルを返すAPIエンドポイントです。そのCSSファイルが読み込まれるたびに、myfontsは、最後のハッシュに対応するアカウントの月間ページビュー数に+1を追加します。この場合は123d4d

繰り返しになりますが、フォント自体のロードとは何の関係もありません。サーバー上にファイルがあり、参照されるとロードされます—完全に停止します。

38