私はこのinfo log
がGoogle Chrome Dev(バージョン55.0.2883.18 dev)に登場し始めたことに気づきましたが、その理由は想像できません。
遅いネットワークが検出されました。フォールバックフォントはロード中に使用されます: http://font-path.extension `
ローカルページやChrome拡張機能でも、font-face
を使用するすべてのWebサイトに表示されます。
これはネットワークが遅いことを意味し、Chromeはウェブフォント(@font-face
ルールがロードされている)をローカルフォールバックに置き換えています。
デフォルトでは、Webフォントでレンダリングされたテキストは、フォントがダウンロードされるまで表示されません( 「表示されないテキストのフラッシュ」 )。この変更により、遅いネットワーク上のユーザーは、空のページを数秒間調べるのではなく、コンテンツが読み込まれたときにすぐに読み始めることができます。
私はサーバーとしてlocalhost
を使ってMacOs Sierra上でchrome build 61.0.3163.100
について同じ問題に直面しました。 Chromeは、ネットワーク速度設定を3G高速/ 3G低速に変更してから再びオンラインに戻したときに、このメッセージの記録を開始しました。
修正: オフラインモードをもう一度オンラインモードにしようとすると、ログの問題が解決しました。 (この修正は一部のデバイスやバージョンでは機能しない可能性があります)
2018年1月30日に更新
Google Chromeをバージョン64.0.3282.119 (Official Build) (64-bit)
に更新しました。このバグは現在修正されているようです。
私の場合は、Googleクロム用のAdBlock Plus拡張機能でした。それを消し、それは完全に働いた。
コンソール設定で隠す
Console settings
- > User messages only
Chrome:// flags /#enable-webfonts-intervention-v2に移動して無効に設定
これはChromeの「ネットワークスピード」の最新のAPIのバグによるものです。次のバージョンで修正されることを願っています
この拡張機能のCSSにアクセスできる場合は、単にフォントフェース定義にfont-display:block;
を追加するか、この拡張機能の開発者にフィードバックを送ってください。
@font-face {
font-family: ExampleFont;
src: url(/path/to/fonts/examplefont.woff) format('woff'),
url(/path/to/fonts/examplefont.eot) format('eot');
font-weight: 400;
font-style: normal;
font-display: block;
}
ネットワークスロットルを無効にしましたが、75mb/sのビジネス接続で今日このエラーが発生し始めました...
Chrome 60.0.3112.90(公式ビルド)(64ビット)で修正するには、DevToolsを開いてDevToolsの設定に移動し、[Log XMLHttpRequests]、[ユーザーメッセージのみ]、[ネットワークメッセージを隠す]のチェックを外します
私はフィルタ正規表現を機能させることに成功しました:/^((?!Fallback\sfont).)*$/
。
コンソールのすぐ上のフィルタフィールドに追加すると、Fallback font
を含むすべてのメッセージが非表示になります。
必要に応じて、より具体的にすることができます。
Googleフォントを使用していて、ユーザーにこれらの警告が表示されないようにするアプリを開発している場合。考えられる解決策( ここで詳細 )は、フォントをローカルに読み込むことでした。
私は時々インターネットが遅い(またはインターネットにアクセスできない)が、まだページを提供しているアプリケーションにこのソリューションを使用しました。また、あなたのアプリケーションにはttfフォントを使うのが適切だと思います WC3 TTFフォントブラウザのサポート 。
これが私がローカルにフォントを提供した方法です:
統合されたバージョン(npm install .... material-icons)にindex.htmlのリンク https://fonts.googleapis.com/icon?family = Material + Icons を置き換えた後、角度付きWebアプリケーションでこの問題が発生します。 ..)。これは動作しますが、Webアプリケーションはその警告を表示することがあります。
警告が表示されているとき、アイコンは約1秒間レンダリングされていないので、ユーザーには正しくレンダリングされていないアイコンが表示されます。
まだ解決策はありません。
私はまたfontawesomeフォントで同じエラーをしました。 それから私は最新のfontawesomeフォントをダウンロードして古いフォントに置き換えました。
ヘルプ - >バージョン情報からChromeの最新バージョン(63.0.3239.84)にアップデートすると、問題が解決しました。
(実際には、最後のエラーをなくすには、開発者ツールの[ネットワーク]タブで[オフライン]に切り替えて[オンライン]に戻る必要がありました。
DuckDuckGo Privacy Essentialsプラグインを無効にするとすぐに消えました。私が提供していたフォントはローカルホストからのものだったので少し面倒なので、遅いネットワーク接続とは関係ないはずです。
マウスの右ボタンをクリックしてChrome Devをクリックします。次にフィルタを選択します。そしてメッセージのソースを選択してください。
Fontのstylesheet.cssに行き、 font-display:blockを追加してください。 全部で @ font-face {}
このStackoverflow Answerは私を助けてくれました..
以下は答えのまとめです。
この拡張子のCSSにアクセスできる場合は、単にfont-display:blockを追加してください。フォントフェイスの定義について、またはこの拡張機能の開発者にフィードバックを送ってください:)
@font-face {
font-family: ExampleFont;
src: url(/path/to/fonts/examplefont.woff) format('woff'),
url(/path/to/fonts/examplefont.eot) format('eot');
font-weight: 400;
font-style: normal;
font-display: block;
}