FontAwesome - 无法解码下载的字体

Question

我已经找到了这个：https://whosebug.com/search?q=Failed+to+decode+downloaded+font

但答案无助于解决我的问题=/

我的页面在控制台中出现了这个错误：

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到我的页面：http://devcomlink.kunena.dev-monkeys.com/index.php?option=com_kunena&view=category&layout=list&Itemid=129&templateStyle=9

在 Firefox 和 IE11 中，图标完全无法加载...

有人知道我该如何解决这个问题吗？

Answer 1

问题不在于您的 HTML 或 CSS 代码...它必须是使用 字体文件 或 服务器 ,

因为正常的字体文件应该有代码，用浏览器打开就可以下载：https://cdnjs.cloudflare.com/ajax/libs/font-awesome/4.7.0/fonts/fontawesome-webfont.eot?v=4.7.0

虽然您的文件看起来是空的，即使下载后也没有任何代码：http://devcomlink.kunena.dev-monkeys.com/components/com_kunena/template/devcomlink/fonts/font-awesome/fontawesome-webfont.eot?v=4.3.0

尝试替换文件...

Answer 2

我也遇到了同样的问题，终于解决了。它可能对某人有帮助。

我有一个很大的 .htacces 文件，其中有很多 RewriteCond 和 RewriteRule，并且还使用以下行从这些条件中过滤了一些文件夹：

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

添加字体文件夹（简称fonts，位于public_html/），问题解决。

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

请注意，此行应该位于 .htaccess 文件的顶部才能正常工作。

Answer 3

为了它的价值，我运行在我的共享网络服务器上解决了这个问题。我的字体文件和封闭文件夹的权限不正确。我花了很长时间才弄明白。将文件夹更改为 755，将字体文件更改为 644。现在完美运行。

Answer 4

我只是为后来的观众回答这个问题。如果您使用的是 maven-war-插件，请确保在过滤中排除 .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>

Answer 5

游戏有点晚了，但这就是我在 .NET MVC 上修复它的原因，它也应该适用于 WebForms。如果您使用 FA 或 GI 来装饰您的登录表单，则字体文件夹将受到限制。您可以通过在 web.config

中执行此操作来提前授予权限

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

希望这对那里的人有所帮助！

Answer 6

与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>

从这个 SO answer 得到了解决方案。

Answer 7

@mujtaba-fadhel 的回答应该可以解决大多数情况下的问题。但是，如果您使用 git，您可能希望将字体扩展设置为二进制，以防它被转换为文本。您需要在项目根目录中创建一个 .gitattributes 文件。

这是一个示例：

*.svg text eol=lf

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

See more about that here

Answer 8

这可能是多种原因的列表，从损坏的文件到服务器问题。我只是通过更改为 fontawesome CDN link 来解决我的问题。希望对您有所帮助。

Answer 9

问题不在于您的 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>

Answer 10

我可能来晚了，但一件简单的事情对我有用。我的 FileZilla 文件传输设置最初选择为“ASCII”。我在某处读到字体文件传输应该是二进制的。所以我将设置更改为自动并再次从本地的原始字体目录上传字体文件。它就像一个魅力。希望这对寻找解决方案的人有用。谢谢

FontAwesome - 无法解码下载的字体

FontAwesome - Failed to decode downloaded font

css

fonts

less

font-awesome