FontAwesome - Failed to decode downloaded font

I found allready this: https://stackoverflow.com/search?q=Failed+to+decode+downloaded+font

But the Answers dont help to fix my problem =/

I got on my page this errors in console:

Failed to decode downloaded font: http://devcomlink.kunena.dev-monkeys.com/components/com_kunena/template/devcomlink/fonts/font-awesome/fontawesome-webfont.woff2
    index.php?option=com_kunena&view=category&layout=list&Itemid=129&templateStyle=9:1 Failed to decode downloaded font: http://devcomlink.kunena.dev-monkeys.com/components/com_kunena/template/devcomlink/fonts/font-awesome/fontawesome-webfont.woff
    index.php?option=com_kunena&view=category&layout=list&Itemid=129&templateStyle=9:1 Failed to decode downloaded font: http://devcomlink.kunena.dev-monkeys.com/components/com_kunena/template/devcomlink/fonts/font-awesome/fontawesome-webfont.ttf

URL to my page: http://devcomlink.kunena.dev-monkeys.com/index.php?option=com_kunena&view=category&layout=list&Itemid=129&templateStyle=9

in Firefox and IE11 the icons totaly dont load...

Have anyone a idea how i can fix this?

The problem isn't with your HTML or CSS code... It must be with the font files or the server,

because normal font files should contain codes and can be downloaded when opened in browser like this : https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0

While your files looks empty without any code even when downloaded: http://devcomlink.kunena.dev-monkeys.com/components/com_kunena/template/devcomlink/fonts/font-awesome/fontawesome-webfont.eot?v=4.3.0

Try to replace the files ...

user1309946

I'm just answering this for later viewers. If you are working with a maven-war-plugin make sure you exclude the .woff and .ttf files in the filtering or maven will make the files corrupt.

<plugin>
    <groupId>org.apache.maven.plugins</groupId>
    <artifactId>maven-war-plugin</artifactId>
    <configuration>
        <filteringDeploymentDescriptors>true</filteringDeploymentDescriptors>
        <webResources>
            <resource>
                <directory>${basedir}/src/main/webapp</directory>
                <targetPath />
                <filtering>true</filtering>
                <excludes>
                    <exclude>**/*.woff</exclude>
                    <exclude>**/*.woff2</exclude>
                    <exclude>**/*.ttf</exclude>
                </excludes>
            </resource>
        </webResources>
    </configuration>
</plugin>

I had the same problem, and finally managed to solve it. It may help someone.

I have quite a large .htacces file, with a lot of RewriteCond's and RewriteRule's, and also used the following line to filter some folders from those conditions:

RewriteRule  ^(css|functions|js|media|tpl|vendor)($|/) - [L]

Upon adding the fonts folder (simply called fonts, and located in public_html/), the problem was solved.

RewriteRule  ^(css|fonts|functions|js|media|tpl|vendor)($|/) - [L]

Note that this line should be fairly at the top of your .htaccess file to work.

Pom12

Similar to the maven-war-plugin usage, if you are using maven-resources-plugin you need to specify that font files extensions shouldn't be filtered :

<plugin>
    <artifactId>maven-resources-plugin</artifactId>
    <version>2.7</version>
    <configuration>
        <encoding>UTF-8</encoding>
        <nonFilteredFileExtensions>
            <nonFilteredFileExtension>ttf</nonFilteredFileExtension>
            <nonFilteredFileExtension>woff</nonFilteredFileExtension>
            <nonFilteredFileExtension>woff2</nonFilteredFileExtension>
        </nonFilteredFileExtensions>
    </configuration>
</plugin>

Got the solution from this SO answer.

For what it's worth, I ran into this issue on my shared web server. The permissions on my font files and the enclosing folder were incorrect. Took me forever to figure it out. Changed them to 755 for the folder and 644 for the font files. Works perfectly now.

A little late to the game, but this is what fixed it for me on .NET MVC should work on WebForms too. If you're using FA or GI to decorate your Login form, the Fonts folder will be restricted. You can give permission in advance by doing this in your web.config

<location path="fonts">
    <system.web>
     <authorization>
     <allow users="*" />
     </authorization>
    </system.web>
</location>

Hope this helps somebody out there!

@mujtaba-fadhel answer should resolve the issue in most cases. But if you are using git, you might want to set your font extensions to binary just in case its being converted to text. You need to create a .gitattributes file in your project root.

This is an example how it could look like:

*.svg text eol=lf

*.eot binary
*.ttf binary
*.woff binary

See more about that here

It might be list of multiple reason from corrupted files to server problems. I simply fixed my problem by changing to a fontawesome CDN link. Hope that helps.

来源：https://stackoverflow.com/questions/31001842/fontawesome-failed-to-decode-downloaded-font

标签

css

fonts

less

font-awesome