【問題&解決】fonts/fontawesome-webfont.woff2 404 (Not Found)

問題：

 

雖然網頁正常顯示和運行，但是有2個字體文件出現404錯誤。像筆者這種強迫症是接受不了的。

 

解決：

因為筆者的服務器是虛擬主機，只需要在主機控制器平台添加對應的MIME類型即可。

這樣服務器就支持這兩種字體文件，不會報錯了。

 

參考的解決方案文章全文如下：

來源：http://www.yneit.com/2016/06/fontsfontawesome-webfont-woff2-404-not-found.html

第一次使用FontAwesome加載字體，但是使用的時候卻提示fonts/fontawesome-webfont.woff2 404 (Not Found)，很明顯這是由於文件不存在導致的問題。然后我們具體來看一下：

可能存在兩種情況：
1、項目發布過程中這個文件沒有被拷貝到發布目錄，我這次碰到的問題就是這個原因導致的，在項目grunt build時會進行文件的copy操作，其中對文件后綴做了限制，所以我只需要加上這個.woff2即可；

2、由於web服務器不支持導致的：
nginx不支持的情況，可以參考下面的配置解決：

location ~* \.(eot|otf|ttf|woff|woff2|svg)$ {
add_header Access-Control-Allow-Origin *;
}
 
AddType application/x-font-woff woff
AddType application/x-font-woff2 woff2

Apache默認是不支持.woff和.woff2的，所以要設置一下：

location ~* \.(eot|otf|ttf|woff|woff2|svg)$ {
add_header Access-Control-Allow-Origin *;
}
 
AddType application/x-font-woff woff
AddType application/x-font-woff2 woff2

IIS默認也是不支持的，可以添加MIME類型來解決：

.woff2 application/x-font-woff