2017-04-01 267 views
0

我的目錄結構是thymeleaf:無靜態資源給予404錯誤

目錄結構

src/ 
    main/ 
    resources/ 
     static/ 
      CSS/ 
      JS/ 
      images/ 

     template/ 
      fragments/ 
         header.html 
         footer.html 
         navBar.html 
      layouts/ 
         appLayout.html 
         baseLayout.html 
       welcome.html 

appLayout.html

<!DOCTYPE html> 
<html xmlns:th="http://www.thymeleaf.org" 
     xmlns:layout="http://www.ultraq.net.nz/thymeleaf/layout"> 

<head> 
     <link rel="stylesheet" type="text/css" media="screen, projection" 
     href="/static/css/bootstrap.css" 
     th:href="@{/bootstrap.min.css}" /> 

    <link rel="stylesheet" type="text/css" media="screen, projection" 
     href="/static/css/bootstrap.css" 
     th:href="@{/css/bootstrap.min.css}" /> 


    <link rel="stylesheet" type="text/css" media="screen, projection" 
     href="/static/css/bootstrap.css" 
     th:href="@{css/bootstrap.min.css}" /> 


    <link href="http://netdna.bootstrapcdn.com/twitter-bootstrap/2.3.0/css/bootstrap.min.css" 
     th:href="@{/webjars/bootstrap/2.3.0/css/bootstrap.min.css}" rel="stylesheet" /> 


</head> 
<body> 

<div th:replace="/fragments/header :: header"></div> 
<div th:replace="/fragments/navbar :: navbar"></div> 
<div class="container"> 
    <div layout:fragment="content"> 
    <p>Content goes here...</p> 
    </div> 
    <footer> 
    <div th:replace="/fragments/footer :: footer"></div> 
    </footer> 
</div> 
</body> 
</html> 

請不要檢查<links>標籤中以上佈局,我已經使用不同的位置鏈接標籤,沒有提供爲什麼它是這樣的?404 error

enter image description here

請看看上面的圖片,我有資源/靜態/ CSS /文件夾,CSS和JS文件,JS爲int /資源/靜態/ JS /文件夾什麼錯誤?爲什麼不是鉻顯示一些靜態資源的404錯誤?

TD; LR靜態資源沒有在我的thymeleaf佈局加載

+0

你可以給出一個具體的例子,你期望一個錯誤? – benkuly

+0

'bootstrap.min.css'在'static/css /'中,所以其他鏈接資源在chrome devtool上應該顯示404錯誤。 – piechuckerr

+0

您是否添加了自定義資源處理程序? – benkuly

回答

1

引導CSS和JS網絡請求返回200,因爲響應成功,但內容不是你所期望的。如果您查看響應,您會看到,對於每個CSS和JS請求,它都會返回HTML頁面welcome.html。

這是因爲您的控制器映射覆蓋了資源請求。您正在使用name參數進行映射,該映射不是正確的屬性。改爲使用value,例如,g:

@RequestMapping(value="/", method=RequestMethod.GET) 

此更改將導致您的CSS和JS請求返回404's。這是進步。

此外,請刪除您的MvcConfig,因爲此行爲是開箱即用的。

最後,調整路徑,你的資源是這樣的:

<link rel="stylesheet" th:href="@{css/bootstrap.min.css}" /> 

現在的CSS和JS請求將成功地與相應的內容返回。

+0

非常感謝您的解決方案。順便說一句,名稱和價值有什麼區別? – piechuckerr

+0

該名稱用作映射的標識符。但是,值用於將URL模式(例如「/」,「/ **」,「/ home」,「/ about」等)與處理程序方法(例如HomeController.gethomePage())進行匹配。 http://docs.spring.io/spring/docs/current/javadoc-api/org/springframework/web/bind/annotation/RequestMapping.html –

+0

@KyleAnderson我試過儘可能多的鏈接到我的引導文件排列爲我可以想到,包括你的答案。你知道爲什麼這可能會返回404嗎?我使用'value'來表示我的所有映射。 – justinraczak

0

靜是springboot默認的資源映射,你並不需要在資源路徑<

link href="/css/bootstrap.min.css"rel="stylesheet"th:href="@{/css/bootstrap.min.css}"/> 
+0

是的,我知道,但它不工作。 – piechuckerr

0

當我從瞭解添加靜態你的文章是,你有一個類似CSS文件和js文件的靜態內容,當你改變這些鏈接的路徑時,它們沒有得到正確的服務。

換句話說,當您更改這些鏈接的路徑時,行爲不會改變,並且您會收到意想不到的結果。

解決這個問題的辦法,或者你的問題的答案,爲什麼我會得到這種行爲是相當簡單的。

當您使用春季啓動,並嘗試以服務靜態內容您的瀏覽器緩存舊的行爲和較舊的請求的舊響應,這意味着你需要胸圍瀏覽器緩存,以獲得您預期的結果當您更改鏈接路徑。

您可以通過添加下面的配置到您的application.properties做文件:

spring.resources.chain.strategy.content.enabled=true 
spring.resources.chain.strategy.content.paths=/** 

,你可以找到如何,而他們的文檔中使用的彈簧啓動這裏提供靜態內容的一些詳細信息:

http://docs.spring.io/spring-boot/docs/1.5.2.RELEASE/reference/htmlsingle/#boot-features-spring-mvc-static-content

+0

我還沒有檢查你的解決方案,但PLZ做檢查我的repo.I非常沮喪https://github.com/PieChuckerr/gateApp – piechuckerr

+0

沒有必要,檢查我的解決方案,我有你的問題幾次,並解決它後在閱讀之後這麼做+ Spring文檔 –