CSS FontAwesome - 无法解码下载的字体
声明：本页面是StackOverFlow热门问题的中英对照翻译，遵循CC BY-SA 4.0协议，如果您需要使用它，必须同样遵循CC BY-SA许可，注明原文地址和作者信息，同时你必须将它归于原作者（不是我）：StackOverFlow
原文地址: http://stackoverflow.com/questions/31001842/
Warning: these are provided under cc-by-sa 4.0 license. You are free to use/share it, But you must attribute it to the original authors (not me):
StackOverFlow
FontAwesome - Failed to decode downloaded font
提问by Shimakuro
I found allready this: https://stackoverflow.com/search?q=Failed+to+decode+downloaded+font
我已经找到了：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
我的页面的 URL：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...
在 Firefox 和 IE11 中，图标完全不加载...
Have anyone a idea how i can fix this?
有谁知道我该如何解决这个问题？
回答by user1309946
I'm just answering this for later viewers. If you are working with a maven-war-plugin make sure you exclude the .woffand .ttffiles in the filtering or maven will make the files corrupt.
我只是为后来的观众回答这个问题。如果您正在使用 maven-war-plugin，请确保在过滤中排除.woff和.ttf文件，否则 maven 会使文件损坏。
<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>
回答by MujtabaFR
The problem isn't with your HTMLor CSScode... It must be with the font filesor the server,
问题不在于您的HTML或CSS代码...它必须与字体文件或服务器有关，
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
因为正常的字体文件应该包含代码，并且可以像这样在浏览器中打开时下载：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
虽然您的文件即使在下载时也没有任何代码看起来是空的：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 ...
尝试替换文件...
回答by Jeffrey Roosendaal
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:
我有一个很大的 .htacces 文件，有很多RewriteCond's 和RewriteRule's，并且还使用以下行从这些条件中过滤一些文件夹：
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.
添加字体文件夹（简称字体，位于public_html/）后，问题就解决了。
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.
请注意，此行应该位于 .htaccess 文件的顶部才能工作。
回答by Pom12
Similar to the maven-war-pluginusage, if you are using maven-resources-pluginyou need to specify that font files extensions shouldn't be filtered :
与maven-war-plugin用法类似，如果您正在使用，则maven-resources-plugin需要指定不应过滤字体文件扩展名：
<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.
从这个SO answer 中得到了解决方案。
回答by Agent Zebra
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.
值得一提的是，我在共享 Web 服务器上遇到了这个问题。我的字体文件和封闭文件夹的权限不正确。我花了很长时间才弄清楚。将文件夹更改为 755，将字体文件更改为 644。现在完美运行。
回答by BasicIsaac
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
游戏有点晚了，但这就是我在 .NET MVC 上修复它的原因，也应该适用于 WebForms。如果您使用 FA 或 GI 来装饰您的登录表单，则 Fonts 文件夹将受到限制。您可以通过在 web.config 中执行此操作来提前授予权限
<location path="fonts">
<system.web>
<authorization>
<allow users="*" />
</authorization>
</system.web>
</location>
Hope this helps somebody out there!
希望这可以帮助那里的人！
回答by Dasun Chathuranga
The problem isn't with your HTMLor CSScode. It must be with the font filesor the server. If your resource files haven't any issue, use following code with maven-resources-plugin. Add this code to your pom.xmlfile.
问题不在于您的HTML或CSS代码。它必须与字体文件或服务器。如果您的资源文件没有任何问题，请将以下代码与maven-resources-plugin 一起使用。将此代码添加到您的pom.xml文件中。
<build>
<resources>
<resource>
<directory>src/main/resources</directory>
<filtering>true</filtering>
<excludes>
<exclude>static/vendor/font-awesome/webfonts/**</exclude>
</excludes>
</resource>
<resource>
<directory>src/main/resources</directory>
<filtering>false</filtering>
<includes>
<include>static/vendor/font-awesome/webfonts/**</include>
</includes>
</resource>
</resources>
</build>
回答by Darlesson
@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 .gitattributesfile in your project root.
在大多数情况下，@mujtaba-fadhel 的回答应该可以解决这个问题。但是如果您使用的是 git，您可能希望将字体扩展名设置为二进制，以防它被转换为文本。您需要.gitattributes在项目根目录中创建一个文件。
This is an example how it could look like:
这是它的外观示例：
*.svg text eol=lf
*.eot binary
*.ttf binary
*.woff binary
回答by Marshall Fungai
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.
它可能是从损坏的文件到服务器问题的多种原因的列表。我只是通过更改为 fontawesome CDN 链接来解决我的问题。希望有帮助。
