Android: Custom fonts not showing up

help
1

I’m using custom fonts in my Cordova app. Since I want it to be able to run offline as well, I’m loading these fonts locally, from the /public folder. This works on iOS, but not on Android. Android defaults to its default fonts. This happens only if the content is run in the app. If I load the same pages in Android’s web-browser, everything is fine. Strange thing is that it worked once, on one of my devices. But after I updated the app to a new version, the fonts reverted to the default fonts on this device again. I’ve absolutely no clue what is happening here.

I’ve seen a similar post here:

Yet this guy used the fonts via remote download and forgot the white-list the Google servers, which is not the case for my app (though I’ve white-listed these servers just to be sure).

EDIT: It turned out that the fonts show up on said device if the Meteor application has been reloaded via hot code reload. This is very strange. It does not work if the app is loaded in its initial configuration, but it does work after HCR. Something weird is going on there…

2

I’m seeing the same thing… any new developments since your last post?

3

Yes, I eventually found out that I caused the problem myself, by inadvertently creating a font path that contained two forward slashes (//) instead of one as part of the font path.

This happened because I was using SASS variables to construct this path, so it was not obvious that the resulting path contained two slashes.

iOS ignored this error, but Android was more picky and refused to load the font in this case. See also this bug report I had filed: