2015-05-31 90 views
0

我正在用Jetty 9託管我的Java webapp,並且我想自己主持fontawesome圖標。但是我沒有看到正確的圖標(他們是正方形的。如果我從CDN鏈接,它工作正常Jetty 9 FontAwesome空圖標

此鏈接

<%--<link rel="stylesheet" href="//maxcdn.bootstrapcdn.com/font-awesome/4.3.0/css/font-awesome.min.css">--%> 

這不

<link rel="stylesheet" type="text/css" href="../resources/font-awesome-4.3.0/css/font-awesome.min.css"/> 

我試着加入以下到我的web.xml

<mime-mapping> 
    <extension>otf</extension> 
    <mime-type>application/x-font-opentype</mime-type> 
    </mime-mapping> 
    <mime-mapping> 
    <extension>ttf</extension> 
    <mime-type>application/x-font-truetype</mime-type> 
    </mime-mapping> 
    <mime-mapping> 
    <extension>woff</extension> 
    <mime-type>application/font-woff</mime-type> 
    </mime-mapping> 
    <mime-mapping> 
    <extension>woff2</extension> 
    <mime-type>application/octet-stream</mime-type> 
    </mime-mapping> 
    <mime-mapping> 
    <extension>eot</extension> 
    <mime-type>application/vnd.ms-fontobject</mime-type> 
    </mime-mapping> 
    <mime-mapping> 
    <extension>svg</extension> 
    <mime-type>image/svg+xml</mime-type> 
    </mime-mapping> 

所有我從IE得到的是以下

CSS3111: @font-face encountered unknown error. File: 
OpenSans-Light.ttf 

和Chrome

 
Failed to decode downloaded font: 
localhost:8080/resources/theme-triton/resources/fonts/OpenSans-Light.ttf 
index.jsp:1 Failed to decode downloaded font: 
localhost:8080/resources/theme-triton/resources/font-awesome/fonts/fontawesome-webfont.woff2?v=4.3.0 
index.jsp:1 Failed to decode downloaded font: 
localhost:8080/resources/theme-triton/resources/fonts/OpenSans-Regular.ttf 
index.jsp:1 Failed to decode downloaded font: 
localhost:8080/resources/theme-triton/resources/fonts/OpenSans-Bold.ttf 
index.jsp:1 Failed to decode downloaded font: 
localhost:8080/resources/theme-triton/resources/font-awesome/fonts/fontawesome-webfont.woff?v=4.3.0 
index.jsp:1 Failed to decode downloaded font: 
localhost:8080/resources/theme-triton/resources/font-awesome/fonts/fontawesome-webfont.ttf?v=4.3.0 
index.jsp:1 Failed to decode downloaded font: 
localhost:8080/resources/font-awesome-4.3.0/fonts/fontawesome-webfont.woff2?v=4.3.0 
index.jsp:1 Failed to decode downloaded font: 
localhost:8080/resources/font-awesome-4.3.0/fonts/fontawesome-webfont.woff?v=4.3.0 
index.jsp:1 Failed to decode downloaded font: 
localhost:8080/resources/font-awesome-4.3.0/fonts/fontawesome-webfont.ttf?v=4.3.0 

響應頭

HTTP/1.1 200 OK 
Content-Type: application/x-font-truetype 
Last-Modified: Sun, 31 May 2015 17:30:12 GMT 
Accept-Ranges: bytes 
Content-Length: 359350 
Server: Jetty(9.2.10.v20150310) 

請求頭

Accept:*/* 
Accept-Encoding:gzip, deflate, sdch 
Accept-Language:en-GB,en-US;q=0.8,en;q=0.6 
Cache-Control:no-cache 
Connection:keep-alive 
Host:localhost:8080 
Pragma:no-cache 
Referer:localhost:8080/wro/test.css 
User-Agent:Mozilla/5.0 (Windows NT 6.1; Win64; x64) AppleWebKit/537.36 (KHTML, like Gecko) Chrome/45.0.2418.0 Safari/537.36 

誰能告訴我是什麼/我在哪裏做錯了?

+0

你可以把鏈接放在託管的地方嗎?您是否檢查過元素檢查器,該文件是否正確鏈接?編輯:好吧,從你的日誌,我認爲你已經確保正確的鏈接。你還可以檢查並確認一次,你在HTML中引用的CSS文件在源代碼中單擊打開罰款? –

回答

2

我沒有指定我正在使用maven來構建我的項目。我只需指定maven不應該過濾的文件擴展名,如果不是maven會破壞文件。這與此問題的回覆類似https://stackoverflow.com/a/31475762/4959062

<plugin> 
    <groupId>org.apache.maven.plugins</groupId> 
    <artifactId>maven-resources-plugin</artifactId> 
    <version>2.7</version> 
    <configuration> 
     <nonFilteredFileExtensions> 
     <nonFilteredFileExtension>woff</nonFilteredFileExtension> 
     <nonFilteredFileExtension>ttf</nonFilteredFileExtension> 
     <nonFilteredFileExtension>woff2</nonFilteredFileExtension> 
     <nonFilteredFileExtension>eot</nonFilteredFileExtension> 
     <nonFilteredFileExtension>swf</nonFilteredFileExtension> 
     <nonFilteredFileExtension>ico</nonFilteredFileExtension> 
     </nonFilteredFileExtensions> 
    </configuration> 
    </plugin> 
1

嘗試在@ font-face {}塊中刪除'?v = 4.3.0'後綴block local的css。