Font Awesome Failed to load resource /font/fontawesome-webfont.woff?v=3.0.1

Question

Everything looks fine on the site, but those two errors are showing up in the console. If I hit the url the font downloads. Been trying to track this down for a while, but I am getting two errors in the console:

Failed to load resource resource:/font/fontawesome-webfont.woff?v=3.0.1
Failed to load resource resource:/font/fontawesome-webfont.ttf?v=3.0.1

How can I get rid of this error?

Answer 1

I recently encountered and solved this problem. The solution is to add the 'font' directory, and any other directories you want resources to be processed to your adhoc includes, so it ends up looking something like this in config.groovy (add directories as needed if you have resources elsewhere).

grails.resources.adhoc.includes = ['/images/**', '/css/**', '/js/**', '/font/**']

More detail here: URLs within CSS files broken with Grails resources plugin 1.2.7

Answer 2

The resource: prefix is an intermediary step in the grails resource plugin's css rewriting process. You appear to be tripping over a bug in either the ad-hoc resource processor or in the css rewriter.

I made an example application (grails 2.1.1, font-awesome 3.0.2, grails-resources 1.1.6) which upon initial load shows no errors. After modifying the font-awesome.css with the application running, the rewriter then throws errors and leaves the broken resource: urls in place.

If I perform the same request with ?_debugResources=true the errors then disappear again.

In my sample's case, leaving the font-awesome files alone after deployment OR using the font-awesome-resources plugin prevented the errors from showing up.

Answer 3

I had the same issue.

Try using-

src:url(asset-path('fontawesome-webfont.eot?v=3.2.1', font));

instead of a direct static path.

It worked for me on clearing up those specific errors.