IDEA創建的Springboot web工程如圖做所示
會發現,springboot的工程中並沒有傳統java web項目中的WEB-INF目錄以及下面的web.xml文件,
這讓人一頭霧水,以前做java web無論使用什麼框架還沒見過不寫web.xml的
兩種web開發思想:
前後端完全分離和使用模板開發;這裏主要介紹下前後端分離這種方式的開發。
1-前後端分離開發
使用這種方式開發web項目,後端全部開發成rest API,前端交給專業的前端開發工程師去開發,後端和前端之前完全解耦,前端工程師可以根據自己的喜好選擇前端開發框架,例如angular、react、vue等。
靜態資源存放路徑:src\main\resources\static\index.html
靜態資源訪問路徑:http://localhost:8080/index.html
js、css、圖片等靜態資源的訪問方式閾值類似;
動態請求全部按照restAPI的方式進行進行響應。
2-使用模板開發
@RequestMapping(value="/")
public String defaultHandler(){
return "thymeleaf";
}
這個例子的是意思是對於所有的請求都將會返回名爲thymeleaf的模板文件。
Thymeleaf的介紹
簡單說, Thymeleaf 是一個跟 Velocity、FreeMarker 類似的模板引擎,它可以完全替代 JSP 。相較與其他的模板引擎,它有如下三個極吸引人的特點:
-
Thymeleaf 在有網絡和無網絡的環境下皆可運行,即它可以讓美工在瀏覽器查看頁面的靜態效果,也可以讓程序員在服務器查看帶數據的動態頁面效果。這是由於它支持 html 原型,然後在 html 標籤裏增加額外的屬性來達到模板+數據的展示方式。瀏覽器解釋 html 時會忽略未定義的標籤屬性,所以 thymeleaf 的模板可以靜態地運行;當有數據返回到頁面時,Thymeleaf 標籤會動態地替換掉靜態內容,使頁面動態顯示。
-
Thymeleaf 開箱即用的特性。它提供標準和spring標準兩種方言,可以直接套用模板實現JSTL、 OGNL表達式效果,避免每天套模板、該jstl、改標籤的困擾。同時開發人員也可以擴展和創建自定義的方言。
-
Thymeleaf 提供spring標準方言和一個與 SpringMVC 完美集成的可選模塊,可以快速的實現表單綁定、屬性編輯器、國際化等功能。
<!-- pom.xml -->
<properties>
<java.version>1.8</java.version>
<!-- 替換成3.0版本-->
<thymeleaf.version>3.0.0.RELEASE</thymeleaf.version>
<thymeleaf-layout-dialect.version>2.0.0</thymeleaf-layout-dialect.version>
</properties>
<dependencies>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
</dependencies>
#application.properties配置
server.port=80
spring.thymeleaf.encoding=UTF-8
spring.thymeleaf.cache=false
spring.thymeleaf.prefix=classpath:/templates/
spring.thymeleaf.check-template=true
spring.thymeleaf.suffix=.html
spring.thymeleaf.mode=HTML5
注意點:
- html文件都放在resource目錄下的 templates 文件下
- 靜態資源,比如css,js,都是放在 resource 目錄下的static文件夾下
freemarker 和 thymeleaf 用哪個
freemarker 不足:
thymeleaf由於使用了標籤屬性做爲語法,模版頁面直接用瀏覽器渲染,使得前端和後端可以並行開發。
freemarket使用</>這樣的語法,就無法直接使瀏覽器渲染出原本頁面的樣子。
thymeleaf優點:
靜態html嵌入標籤屬性,瀏覽器可以直接打開模板文件,便於前後端聯調。
springboot官方推薦方案。
thymeleaf缺點:
模板必須符合xml規範
比較下兩者
1.從寫code的習慣角度可能 freemarker更習慣於我們的思維。
2.不過從前後分離開發的角度看thymeleaf更合適,值的綁定都是基於html的dom元素屬性的,適合前後聯調。