Thymeleaf防坑總結-Thymeleaf防坑錄（持續更新）

Thymeleaf是SpringBoot默認的模板引擎，但是這個模板引擎使用上有一些坑，本文主要對Thymeleaf的坑做一下總結記錄。

坑一：Html/JS代碼轉義問題

正經篇：

Thymeleaf對Html、JS代碼要求極其嚴格，稍微不注意，就會報錯。（嚴格到沒有天理。。。。。）

HTML

由於歷史問題，Html的代碼一直以來都不規範，即使有了規範，Html解析器也會對Html代碼保持“寬容”，對不規範的代碼照樣處理。如：Html有些標籤已經限定了必須加上/表示結束，而有些便籤則可能不加，如<link>、<meta>、<img>等。

而Thymeleaf 則對Html代碼要求特別嚴格，一些稍微沒有閉合的標籤就會報異常無法解析。

解決方案（減少Thymeleaf對Html規範要求）：

在SpringBoot下，只需添加依賴：

<dependency>
    <groupId>net.sourceforge.nekohtml</groupId>
    <artifactId>nekohtml</artifactId>
    <version>1.9.21</version>
</dependency>

再在配置文件中配置

spring:
  thymeleaf:
    suffix: .html
    prefix: classpath:/templates/
    mode: LEGACYHTML5

就可以完美解決Thymeleaf對Html代碼及JS代碼轉義的問題。

JS

Thymeleaf會對Html文件中的js代碼當成Html代碼進行解析，然後就會出現吊軌的一幕。<、>、&等都報錯。一系類奇奇怪怪的問題。

解決方案：在 js 里加上  /*<![CDATA[*/ 和 /*]]>*/ ，避免轉義。【當然，如果添加了nekohtml依賴處理，則不會對這些符號進行還轉義，就不會出現這個問題】

故事搞笑篇：

1.對Html代碼嚴格限制

標籤們經常會到各大Html解析器的家裏玩。一些標籤們不喜歡上門帶禮物（帶上閉合標籤），解析器們對其處理一般是睜一隻眼閉一隻眼，因爲這幾年對收禮行爲處理得很嚴重。而Thymeleaf就不一樣了，就要搞特殊，就要收禮，沒帶禮物的話，嘿嘿。

故事就這樣展開了。。。。。

<link>、<img>、<input>標籤們：來呀，老弟們，我們一起組隊去串門，說好了大家都不許帶禮，“法不責衆”。

Html解析器（瀏覽器等）：可愛的標籤們來啦。哈哈哈，有沒有帶。。。。額。行吧，我睜一隻眼閉一隻眼，誰叫最近查的嚴呢，不規範就不規範了，我來解決你代碼不規範的問題，不規範我會兼容，讓你們這些標籤儘可能顯示。.

(生活就要佛系，不送禮不打緊，事情照樣辦的槓槓的)

<link>標籤：這個瀏覽器那麼好，在他家他幫我們辦事還請我們吃了飯。好久沒吃那麼飽了，下次我們去下一家吃飯，抽個籤去哪裏好了。。（抽到|Thymeleaf）。

<img>標籤:這是啥？。。

<meta> 標籤（發抖）：這。。。他就住在我們隔壁。。。這是一個啥禮都收的傢伙。恐怕去了我們不能兩手空空去呀。。

<link>標籤：甭管啥，崩怕，我們明天一起去，萬物皆可盤，我們還怕它？明天大家還是老樣子，讓它長點見識，我們可不是蓋的。

 

第二天。。。。。。。

<link>、<img>、<input>標籤們（敲門）：老王。我們來蹭飯了。你不出來，我們就一個一個進去咯。

Thymelea（小名叫老王）：(又有人來送禮了，其實我也不是很想收，他們不好意思叫我做事（解析），就給我禮物，我也不好拒絕呀。但是，如果這些標籤敢不按“標準行事”我就讓他們吃不了兜着走。敢不送禮叫我做事？找shi！！！！)   好的，我畫好裝了，怕羞，你們一個個進來吧。你們懂得的。

於是，在這些標籤們去Thymeleaf家裏玩不帶上禮物，就會

<link> ： 我來啦老王，你家裏有什麼好吃的嗎？我要....

thymeleaf：first blood（一血）

org.xml.sax.SAXParseException: The element type "link" must be terminated by the matching end-tag "</link>".
	at org.apache.xerces.util.ErrorHandlerWrapper.createSAXParseException(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.util.ErrorHandlerWrapper.fatalError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLScanner.reportFatalError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]

<meta> ： 我來啦老王，你家裏有什麼好吃的....

thymeleaf：doublekill（雙殺）

org.xml.sax.SAXParseException: The element type "meta" must be terminated by the matching end-tag "</meta>".
	at org.apache.xerces.util.ErrorHandlerWrapper.createSAXParseException(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.util.ErrorHandlerWrapper.fatalError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLScanner.reportFatalError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLDocumentFragmentScannerImpl.scanEndElement(Unknown Source) ~[xercesImpl-2.10.0.jar:na]

<img> ： 我來啦老王，你家裏....

thymeleaf： triplekill（三殺）

org.xml.sax.SAXParseException: The element type "img" must be terminated by the matching end-tag "</img>".
	at org.apache.xerces.util.ErrorHandlerWrapper.createSAXParseException(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.util.ErrorHandlerWrapper.fatalError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLScanner.reportFatalError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLDocumentFragmentScannerImpl.scanEndElement(Unknown Source) ~[xercesImpl-2.10.0.jar:na]

<input> ： 我來啦老王....

thymeleaf：quatarykill（四殺）

org.xml.sax.SAXParseException: The element type "input" must be terminated by the matching end-tag "</input>".
	at org.apache.xerces.util.ErrorHandlerWrapper.createSAXParseException(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.util.ErrorHandlerWrapper.fatalError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLScanner.reportFatalError(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLDocumentFragmentScannerImpl.scanEndElement(Unknown Source) ~[xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLDocumentFragmentScannerImpl$FragmentContentDispatcher.dispatch(Unknown Source) ~[xercesImpl-2.10.0.jar:na]

<br> ： 我....只是路過的。。。。

thymeleaf：pentakill（五殺）

org.xml.sax.SAXParseException: The element type "br" must be terminated by the matching end-tag "</br>".
	at org.apache.xerces.util.ErrorHandlerWrapper.createSAXParseException(Unknown Source) [xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.util.ErrorHandlerWrapper.fatalError(Unknown Source) [xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) [xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) [xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLErrorReporter.reportError(Unknown Source) [xercesImpl-2.10.0.jar:na]
	at org.apache.xerces.impl.XMLScanner.reportFatalError(Unknown Source) [xercesImpl-2.10.0.jar:na]

thymeleaf：beyond godlike（神一樣）

2.對JS代碼限制

Thymeleaf對JS也有限制，會對js中的代碼進行轉義。此刻就會出錯了。

 

聽完一羣標籤們被揍的事情後，JS不以爲然，畢竟家裏有礦。

JS在一旁樂呵呵：我就沒事，看我去找老王。

JS：老王呀，我可是不用帶禮物的，因爲我爸是李。。。

Thymeleaf：Seven-hour close to

JS的爸李某：我可是有牌面的，居然被這個小子羞辱我兒，看我的。

解決方案：在 js 里加上  /*<![CDATA[*/ 和 /*]]>*/ ，避免轉義。

JS：來呀，大凶帶，我說了吧，我爸是李gang。

Thymeleaf：真的呀，誤會誤會，改天我請客表示歉意。。真誤會，不好意思。

 

3.解決方案：程序員小哥（標籤們的大老闆）：

程序小哥：這Thymeleaf真的是太不像話了，再這樣下去我可要破產了。不行，我要去網上找找有沒有破解版的。

於是，解決方案來了。

在SpringBoot下，只需要添加依賴

<dependency>
    <groupId>net.sourceforge.nekohtml</groupId>
    <artifactId>nekohtml</artifactId>
    <version>1.9.21</version>
</dependency>

再在配置文件中配置

spring:
  thymeleaf:
    suffix: .html
    prefix: classpath:/templates/
    mode: LEGACYHTML5

就可以使用“盜版”，這次小哥終於可以不用花錢送禮了。開森。

 

 

坑二：th：fragment引用問題（20190223更新）

Thymeleaf的模塊化是通過th：fragment屬性等完成的。

普通的使用當然不會出現問題，但是，如果“特殊”地使用就會發生靈異事件了。。。。。

一般在寫好th：fragment代碼後，需要在“包含它”的地方使用div的th:include標籤進行引入。

<div th:include="/common/header::Header"/>

以上方式有時候會出現問題的。

返回的Html代碼可能僅僅包含Header裏面的代碼（具體看你包含這個頭的代碼如何include）。

大白話講就是，在<div th:include="/common/header::Header"/> 之後的Html代碼，無法顯示。被截斷了。

 

發生場景：

1.爲了解除Thymeleaf對Html代碼的嚴格要求，

在SpringBoot下，添加了依賴

<dependency>
    <groupId>net.sourceforge.nekohtml</groupId>
    <artifactId>nekohtml</artifactId>
    <version>1.9.21</version>
</dependency>

2.然後th：fragment代碼通過div的th:include標籤進行引入。而此時標籤是直接閉合的。

<div th:include="/common/header::Header"/>

結果，Html代碼就被截斷了。這是添加nekohtml後，<div th:include>標籤直接閉合導致的結果。

 

解決方案：

很簡單。這樣就好了。。。Thymeleaf的“坑”不少鴨

<div th:include="/common/header::Header"> </div>

 

坑三：待發現（待更新）

欲加之罪，何患無辭。嘿嘿嘿