'Failed to load font' error

guidezpl commented 4 months ago

Package

google_fonts

Description

If you ran into this error, it means that an attempt was made to fetch a font TTF file from Google Fonts' servers, but failed. For example:

Exception has occurred.
_Exception (Exception: Failed to load font with url https://fonts.gstatic.com/s/a/85fcd167f63837ebb1c310a8e83bf1d5039fbbd5a13ac4812691d52817631161.ttf: Failed host lookup: 'fonts.gstatic.com')

Solution

The most common reason is the device/emulator/simulator doesn't have internet access.

For macOS and Android, you must allow HTTP requests following these instructions
If this occurred in a test, see https://github.com/material-foundation/flutter-packages/blob/main/packages/google_fonts/example/test for how to set up things properly
Your device/emulator/simulator may not be connected to Wi-Fi or a mobile network
(Highly unlikely) The URL may be invalid, or Google Fonts may be down. Navigate to https://fonts.gstatic.com/s/a/85fcd167f63837ebb1c310a8e83bf1d5039fbbd5a13ac4812691d52817631161.ttf to verify.

Background

The default behavior for this package is to fetch (and cache) fonts from the Internet at runtime. Including chosen fonts at build time is also supported, instructions for doing this are in the README.

Still need help?

If you ran into this issue and have eliminated all possible causes listed above, please comment with all relevant information (Wi-Fi / mobile network, target device & OS, flutter version -v, etc.)

offline-first commented 3 months ago

The problem is that despite "catchError" an error is logged in the Firebase console.

For example:


GoogleFonts.pendingFonts([
      GoogleFonts.soraTextTheme(),
    ]).then((value){
      debugPrint("[Theme][fetchFonts] all font fetched!");
    }, onError: (e)async{
      debugPrint("[Theme][fetchFonts] error: $e");
    }).catchError((e){
      debugPrint("[Theme][fetchFonts] catchError: $e");
    });```

Princewil commented 3 months ago

Please any solution for this?

Princewil commented 2 months ago

Any fix for this?

rockeypandit commented 1 month ago

Any Fix to this ? its been long since the issue is opened

Tr736 commented 1 month ago

Also seeing thousands of these errors thrown in sentry. Please fix

treeplate commented 1 month ago

read the "solution" part of the OP's comment

kaboc commented 1 month ago

The solutions listed there only help those who have no idea what has caused the errors. In my case, I already know why they are thrown.

Excerpt from the README:

HTTP fetching at runtime, ideal for development. Can also be used in production to reduce app size

Font file caching, on device file system

Font bundling in assets. Matching font files found in assets are prioritized over HTTP fetching. Useful for offline-first apps.

I wouldn't choose HTTP fetching if the document strongly recommended we avoid it, or if fetching should never fail. However, it is clearly stated that it can be used in production, and I think everyone knows that fetching fails if there is no Internet connection or the servers are down. "To reduce app size" is a very common reason we choose it over bundling if the app is not offline-first. I (and probably some others here) have opted in to use HTTP fetching, already knowing connection errors sometimes occur.

In that case, thousands of error logs appearing in an error monitoring tool are just a noise. It is possible to mark those logs as "closed" on Crashlytics to make them hidden, but I've heard that having a large number of errors affects the visibility of the app in the Play Store. (I'm not sure about the App Store and whether errors marked as closed still have a negative impact in the same way.) Shouldn't there be a way to mute such logs on the app side? Or should I manually check the error message to exclude this particular error from the logs sent to Crashlytics?

material-foundation / flutter-packages