開發Web應用
靜態資源訪問
在我們開發Web應用的時候,需要引用大量的js、css、圖片等靜態資源。
預設配置
Spring Boot預設提供靜態資源目錄位置需置於classpath下,目錄名需符合如下規則:
-
/static
-
/public
-
/resources
-
/META-INF/resources
舉例:我們可以在
src/main/resources/
目錄下建立
static
,在該位置放置一個圖片檔案。啟動程式後,嘗試訪問
。如能顯示圖片,配置成功。
渲染Web頁面
在之前的示例中,我們都是透過@RestController來處理請求,所以返回的內容為json物件。那麼如果需要渲染html頁面的時候,要如何實現呢?
模板引擎
在動態HTML實現上Spring Boot依然可以完美勝任,並且提供了多種模板引擎的預設配置支援,所以在推薦的模板引擎下,我們可以很快的上手開發動態網站。
Spring Boot提供了預設配置的模板引擎主要有以下幾種:
-
Thymeleaf
-
FreeMarker
-
Velocity
-
Groovy
-
Mustache
Spring Boot建議使用這些模板引擎,避免使用JSP,若一定要使用JSP將無法實現Spring Boot的多種特性,具體可見後文:支援JSP的配置
當你使用上述模板引擎中的任何一個,它們預設的模板配置路徑為:
src/main/resources/templates
。當然也可以修改這個路徑,具體如何修改,可在後續各模板引擎的配置屬性中查詢並修改。
Thymeleaf
Thymeleaf是一個XML/XHTML/HTML5模板引擎,可用於Web與非Web環境中的應用開發。它是一個開源的Java庫,基於Apache License 2.0許可,由Daniel Fernández建立,該作者還是Java加密庫Jasypt的作者。
Thymeleaf提供了一個用於整合Spring MVC的可選模組,在應用開發中,你可以使用Thymeleaf來完全代替JSP或其他模板引擎,如Velocity、FreeMarker等。Thymeleaf的主要目標在於提供一種可被瀏覽器正確顯示的、格式良好的模板建立方式,因此也可以用作靜態建模。你可以使用它建立經過驗證的XML與HTML模板。相對於編寫邏輯或程式碼,開發者只需將標籤屬性新增到模板中即可。接下來,這些標籤屬性就會在DOM(文件物件模型)上執行預先制定好的邏輯。
示例模板:
<table> <thead> <tr> <th th:text="#{msgs.headers.name}">Name</td> <th th:text="#{msgs.headers.price}">Price</td> </tr> </thead> <tbody> <tr th:each="prod : ${allProducts}"> <td th:text="${prod.name}">Oranges</td> <td th:text="${#numbers.formatDecimal(prod.price,1,2)}">0.99</td> </tr> </tbody> </table>
可以看到Thymeleaf主要以屬性的方式加入到html標籤中,瀏覽器在解析html時,當檢查到沒有的屬性時候會忽略,所以Thymeleaf的模板可以透過瀏覽器直接開啟展現,這樣非常有利於前後端的分離。
在Spring Boot中使用Thymeleaf,只需要引入下面依賴,並在預設的模板路徑
src/main/resources/templates
下編寫模板檔案即可完成。
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-thymeleaf</artifactId> </dependency>
來自 “ ITPUB部落格 ” ,連結:http://blog.itpub.net/31539957/viewspace-2168755/,如需轉載,請註明出處,否則將追究法律責任。
相關文章
- 《Flask Web開發 基於Python的Web應用開發實戰》簡評FlaskWebPython
- [應用案例]完美自適應WEB開發官網Web
- 使用 Flutter 開發簡單的 Web 應用FlutterWeb
- 開發Web應用為什麼要用TypeScript?WebTypeScript
- [譯] Rust 開發完整的 Web 應用程式RustWeb
- Golang 入門系列(十三)用Beego開發web應用GolangWeb
- 《Flask Web開發:基於Python的Web應用開發實戰》學習筆記(二)FlaskWebPython筆記
- 使用SAP UI5 Web Components開發React應用UIWebReact
- 是否有應用onethink開發web的詳細教程Web
- 自開發Web應用和SAPCustomerDataCloudIdentity服務的整合WebCloudIDE
- web開發安全框架中的Apache Shiro的應用Web框架Apache
- WEB例項:開發一個聊天室應用Web
- dotnet core使用開源元件FastHttpApi進行web應用開發元件ASTHTTPAPIWeb
- web開發實戰教程:Apache Shiro在web專案中的應用WebApache
- Gradio.NET 支援 .NET 8 簡化 Web 應用開發Web
- Python 如何開發高效漂亮的輕量級 Web 應用?PythonWeb
- Vue.js + Tone.js 開發Web鋼琴應用Vue.jsWeb
- 基於springmvc+spring-data-jpa+dubbo開發web應用SpringMVCWeb
- JSON資料格式及其在WEB開發中的應用JSONWeb
- Web | 淺談用Python進行Web開發WebPython
- 在30天內學習漸進式Web應用開發Web
- 漸進式web應用開發---promise式資料庫(五)WebPromise資料庫
- 淺談canvas在web開發中的應用與優化CanvasWeb優化
- 以太坊和Metamask開發web應用時不再需要密碼Web密碼
- 用 React 結合 SAP UI5 Web Components 來開發 SAP Fiori 應用ReactUIWeb
- 1.1.4 應用開發
- 漸進式web應用開發---service worker 原理及介紹(一)Web
- 漸進式web應用開發--擁抱離線優先(三)Web
- Web 前端開發日誌(四):構建現代化 Node 應用Web前端
- SpringCloudSpringBootmybatis分散式微服務雲架構(八)開發Web應用(2)GCCloudSpring BootMyBatis分散式微服務架構Web
- SpringCloudSpringBootmybatis分散式微服務雲架構(七)開發Web應用(1)GCCloudSpring BootMyBatis分散式微服務架構Web
- Maven Web 應用MavenWeb
- 用vscode開發vue應用VSCodeVue
- (資料科學學習手札119)Python+Dash快速web應用開發——多頁面應用資料科學PythonWeb
- 《Django 3 Web應用開發從零開始學(影片教學版)》簡介DjangoWeb
- 用Spring Web Flow和Terracotta搭建Web應用SpringWeb
- 人人都是 Serverless 架構師 | 現代化 Web 應用開發實戰Server架構Web
- "零"學習成本:使用 Web 標準開發動態化 Flutter 應用WebFlutter