SpringBoot2 整合FreeMarker實(shí)現(xiàn)頁(yè)面靜態(tài)化示例詳解
一、頁(yè)面靜態(tài)化
1、動(dòng)靜態(tài)頁(yè)面
靜態(tài)頁(yè)面
即靜態(tài)網(wǎng)頁(yè),指已經(jīng)裝載好內(nèi)容HTML頁(yè)面,無(wú)需經(jīng)過(guò)請(qǐng)求服務(wù)器數(shù)據(jù)和編譯過(guò)程,直接加載到客戶(hù)瀏覽器上顯示出來(lái)。通俗的說(shuō)就是生成獨(dú)立的HTML頁(yè)面,且不與服務(wù)器進(jìn)行數(shù)據(jù)交互。
優(yōu)缺點(diǎn)描述:
- 靜態(tài)網(wǎng)頁(yè)的內(nèi)容穩(wěn)定,頁(yè)面加載速度極快;
- 不與服務(wù)器交互,提升安全性;
- 靜態(tài)網(wǎng)頁(yè)的交互性差,數(shù)據(jù)實(shí)時(shí)性很低;
- 維度成本高,生成很多HTML頁(yè)面;
動(dòng)態(tài)頁(yè)面
指跟靜態(tài)網(wǎng)頁(yè)相對(duì)的一種網(wǎng)頁(yè)編程技術(shù),頁(yè)面的內(nèi)容需要請(qǐng)求服務(wù)器獲取,在不考慮緩存的情況下,服務(wù)接口的數(shù)據(jù)變化,頁(yè)面加載的內(nèi)容也會(huì)實(shí)時(shí)變化,顯示的內(nèi)容卻是隨著數(shù)據(jù)庫(kù)操作的結(jié)果而動(dòng)態(tài)改變的。
優(yōu)缺點(diǎn)描述:
- 動(dòng)態(tài)網(wǎng)頁(yè)的實(shí)時(shí)獲取數(shù)據(jù),延遲性低;
- 依賴(lài)數(shù)據(jù)庫(kù)交互,頁(yè)面維護(hù)成本很低;
- 與數(shù)據(jù)庫(kù)實(shí)時(shí)交互,安全控制的成本高;
- 頁(yè)面加載速度十分依賴(lài)數(shù)據(jù)庫(kù)和服務(wù)的性能;
動(dòng)態(tài)頁(yè)面和靜態(tài)頁(yè)面有很強(qiáng)的相對(duì)性,對(duì)比之下也比較好理解。
2、應(yīng)用場(chǎng)景
動(dòng)態(tài)頁(yè)面靜態(tài)化處理的應(yīng)用場(chǎng)景非常多,例如:
- 大型網(wǎng)站的頭部和底部,靜態(tài)化之后統(tǒng)一加載;
- 媒體網(wǎng)站,內(nèi)容經(jīng)過(guò)渲染,直接轉(zhuǎn)為HTML網(wǎng)頁(yè);
- 高并發(fā)下,CDN邊緣節(jié)點(diǎn)代理的靜態(tài)網(wǎng)頁(yè);
- 電商網(wǎng)站中,復(fù)雜的產(chǎn)品詳情頁(yè)處理;
靜態(tài)化技術(shù)的根本:提示服務(wù)的響應(yīng)速度,或者說(shuō)使響應(yīng)節(jié)點(diǎn)提前,如一般的流程,頁(yè)面(客戶(hù)端)請(qǐng)求服務(wù),服務(wù)處理,響應(yīng)數(shù)據(jù),頁(yè)面裝載,一系列流程走下來(lái)不僅復(fù)雜,而且耗時(shí),如果基于靜態(tài)化技術(shù)處理之后,直接加載靜態(tài)頁(yè)面,好了請(qǐng)求結(jié)束。
二、流程分析
靜態(tài)頁(yè)面轉(zhuǎn)換是一個(gè)相對(duì)復(fù)雜的過(guò)程,其中核心流程如下:
- 開(kāi)發(fā)一個(gè)頁(yè)面模板,即靜態(tài)網(wǎng)頁(yè)樣式;
- 提供接口,給頁(yè)面模板獲取數(shù)據(jù);
- 頁(yè)面模板中編寫(xiě)數(shù)據(jù)接口返參的解析流程;
- 基于解析引擎,把數(shù)據(jù)和頁(yè)面模板合并;
- 頁(yè)面模板內(nèi)容加載完成后轉(zhuǎn)換為HTML靜態(tài)頁(yè)面;
- HTML靜態(tài)頁(yè)面上傳到文件服務(wù)器;
- 客戶(hù)端(Client)獲取靜態(tài)頁(yè)面的url加載顯示;
主流程大致如上,如果數(shù)據(jù)接口響應(yīng)參數(shù)有變,則需要重新生成靜態(tài)頁(yè),所以在數(shù)據(jù)的加載實(shí)時(shí)性上面會(huì)低很多。
三、代碼實(shí)現(xiàn)案例
1、基礎(chǔ)依賴(lài)
FreeMarker是一款模板引擎:即一種基于模板和要改變的數(shù)據(jù),并用來(lái)生成輸出文本(HTML網(wǎng)頁(yè)、電子郵件、配置文件、源代碼等)的通用工具。
<dependency> <groupId>org.springframework.boot</groupId> <artifactId>spring-boot-starter-freemarker</artifactId> </dependency>
2、頁(yè)面模板
這里既使用FreeMarker開(kāi)發(fā)的模板樣式。
<html> <head> <title>PageStatic</title> </head> <body> 主題:${myTitle}<br/> <#assign text="{'auth':'cicada','date':'2020-07-16'}" /> <#assign data=text?eval /> 作者:${data.auth} 日期:${data.date}<br/> <table class="table table-striped table-hover table-bordered" id="editable-sample"> <thead> <tr> <th>規(guī)格描述</th> <th>產(chǎn)品詳情</th> </tr> </thead> <tbody> <#list tableList as info> <tr class=""> <td>${info.desc}</td> <td><img src="${info.imgUrl}" height="80" width="80"></td> </tr> </#list> </tbody> </table><br/> <#list imgList as imgIF> <img src="${imgIF}" height="300" width="500"> </#list> </body> </html>
FreeMarker的語(yǔ)法和原有的HTML語(yǔ)法基本一致,但是具有一套自己的數(shù)據(jù)處理標(biāo)簽,用起來(lái)不算復(fù)雜。
3、解析過(guò)程
通過(guò)解析,把頁(yè)面模板和數(shù)據(jù)接口的數(shù)據(jù)合并到一起即可。
@Service public class PageServiceImpl implements PageService { private static final Logger LOGGER = LoggerFactory.getLogger(PageServiceImpl.class) ; private static final String PATH = "/templates/" ; @Override public void ftlToHtml() throws Exception { // 創(chuàng)建配置類(lèi) Configuration configuration = new Configuration(Configuration.getVersion()); // 設(shè)置模板路徑 String classpath = this.getClass().getResource("/").getPath(); configuration.setDirectoryForTemplateLoading(new File(classpath + PATH)); // 加載模板 Template template = configuration.getTemplate("my-page.ftl"); // 數(shù)據(jù)模型 Map<String, Object> map = new HashMap<>(); map.put("myTitle", "頁(yè)面靜態(tài)化(PageStatic)"); map.put("tableList",getList()) ; map.put("imgList",getImgList()) ; // 靜態(tài)化頁(yè)面內(nèi)容 String content = FreeMarkerTemplateUtils.processTemplateIntoString(template, map); LOGGER.info("content:{}",content); InputStream inputStream = IOUtils.toInputStream(content,"UTF-8"); // 輸出文件 FileOutputStream fileOutputStream = new FileOutputStream(new File("F:/page/newPage.html")); IOUtils.copy(inputStream, fileOutputStream); // 關(guān)閉流 inputStream.close(); fileOutputStream.close(); } private List<TableInfo> getList (){ List<TableInfo> tableInfoList = new ArrayList<>() ; tableInfoList.add(new TableInfo(Constant.desc1, Constant.img01)); tableInfoList.add(new TableInfo(Constant.desc2,Constant.img02)); return tableInfoList ; } private List<String> getImgList (){ List<String> imgList = new ArrayList<>() ; imgList.add(Constant.img02) ; imgList.add(Constant.img02) ; return imgList ; } }
生成后的HTML頁(yè)面直接使用瀏覽器打開(kāi)即可,不再需要依賴(lài)任何數(shù)據(jù)接口服務(wù)。
四、源代碼地址
GitHub·地址 https://github.com/cicadasmile/middle-ware-parent
GitEE·地址 https://gitee.com/cicadasmile/middle-ware-parent
到此這篇關(guān)于SpringBoot2 整合FreeMarker實(shí)現(xiàn)頁(yè)面靜態(tài)化示例詳解的文章就介紹到這了,更多相關(guān)SpringBoot2 整合FreeMarker實(shí)現(xiàn)頁(yè)面靜態(tài)化內(nèi)容請(qǐng)搜索腳本之家以前的文章或繼續(xù)瀏覽下面的相關(guān)文章希望大家以后多多支持腳本之家!
- springboot整合freemarker的踩坑及解決
- springboot整合freemarker代碼自動(dòng)生成器
- Springboot整合Freemarker的實(shí)現(xiàn)詳細(xì)過(guò)程
- springboot 自定義權(quán)限標(biāo)簽(tld),在freemarker引用操作
- Springboot整合freemarker 404問(wèn)題解決方案
- SpringBoot2.2.X用Freemarker出現(xiàn)404的解決
- 構(gòu)建SpringBoot+MyBatis+Freemarker的項(xiàng)目詳解
- SpringBoot整合FreeMarker的過(guò)程詳解
相關(guān)文章
Spring Boot整合web層實(shí)現(xiàn)過(guò)程詳解
這篇文章主要介紹了Spring Boot整合web層實(shí)現(xiàn)過(guò)程詳解,文中通過(guò)示例代碼介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或者工作具有一定的參考學(xué)習(xí)價(jià)值,需要的朋友可以參考下2020-04-04Mybatis模糊查詢(xún)之三種定義參數(shù)方法和聚合查詢(xún)、主鍵回填實(shí)現(xiàn)方法
這篇文章主要介紹了Mybatis模糊查詢(xún)之三種定義參數(shù)方法和聚合查詢(xún)、主鍵回填實(shí)現(xiàn)方法,本文給大家介紹的非常詳細(xì),對(duì)大家的學(xué)習(xí)或工作具有一定的參考借鑒價(jià)值,需要的朋友可以參考下2023-03-03Java實(shí)現(xiàn)一個(gè)簡(jiǎn)單計(jì)算器
這篇文章主要介紹了Java實(shí)現(xiàn)一個(gè)簡(jiǎn)單計(jì)算器,文章我圍繞實(shí)現(xiàn)簡(jiǎn)單計(jì)算器的相關(guān)代碼展現(xiàn)全文,具有一定的參考價(jià)值,需要的小伙伴可以參考一下,2022-01-01Mybatis-plus如何通過(guò)反射實(shí)現(xiàn)動(dòng)態(tài)排序不同字段功能
這篇文章主要介紹了Mybatis-plus如何通過(guò)反射實(shí)現(xiàn)動(dòng)態(tài)排序不同字段功能,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-02-02java 實(shí)現(xiàn)增量同步和自定義同步的操作
這篇文章主要介紹了java 實(shí)現(xiàn)增量同步和自定義同步的操作,具有很好的參考價(jià)值,希望對(duì)大家有所幫助。一起跟隨小編過(guò)來(lái)看看吧2021-01-01java正則表達(dá)式提取數(shù)字的方法實(shí)例
這篇文章主要介紹了java正則表達(dá)式提取數(shù)字的方法,還有去除字符串?dāng)?shù)字的方法,大家參考使用吧2013-12-12springboot的application.yml配置port不生效的解決方案
這篇文章主要介紹了springboot的application.yml配置port不生效的解決方案,具有很好的參考價(jià)值,希望對(duì)大家有所幫助,如有錯(cuò)誤或未考慮完全的地方,望不吝賜教2024-07-07淺析打開(kāi)eclipse出現(xiàn)Incompatible JVM的解決方法
本篇文章是對(duì)打開(kāi)eclipse出現(xiàn)Incompatible JVM的解決方法進(jìn)行了詳細(xì)的分析介紹,需要的朋友參考下2013-07-07