Springとthymeleaf（タイムリーフ）を連携する

2015/5/5 spring

Springとthymeleaf（タイムリーフ）を連携する

SpgingMVCプロジェクトのpom.xmlに以下を追記します。

<dependency>
<groupId>org.thymeleaf</groupId>
<artifactId>thymeleaf-spring3</artifactId>
<version>2.1.2.RELEASE</version>
</dependency>

<groupId>org.thymeleaf</groupId>

<artifactId>thymeleaf-spring3</artifactId>

<version>2.1.2.RELEASE</version>

</dependency>

次にSpringの設定ファイルservlet-context.xmlを以下のように編集します。

<!-- Resolves views selected for rendering by @Controllers to .jsp resources in the /WEB-INF/views directory -->
<!-- del start -->
<!--
<beans:bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">
<beans:property name="prefix" value="/WEB-INF/views/" />
<beans:property name="suffix" value=".jsp" />
</beans:bean>
-->
<!-- del end -->
<!-- add start -->
<beans:bean id="templateResolver" class="org.thymeleaf.templateresolver.ServletContextTemplateResolver">
<beans:property name="prefix" value="/WEB-INF/templates/" />
<beans:property name="suffix" value=".html" />
<beans:property name="characterEncoding" value="UTF-8"/>
<beans:property name="templateMode" value="HTML5" />
<beans:property name="cacheable" value="false"/>
</beans:bean>

<beans:bean id="templateEngine" class="org.thymeleaf.spring3.SpringTemplateEngine">
<beans:property name="templateResolver" ref="templateResolver" />
</beans:bean>
<beans:bean class="org.thymeleaf.spring3.view.ThymeleafViewResolver">
<beans:property name="templateEngine" ref="templateEngine" />
<beans:property name="characterEncoding" value="UTF-8"/>
</beans:bean>
<!-- add end -->

<!--

<beans:bean class="org.springframework.web.servlet.view.InternalResourceViewResolver">

<beans:property name="prefix" value="/WEB-INF/views/" />

<beans:property name="suffix" value=".jsp" />

</beans:bean>

-->

<beans:bean id="templateResolver" class="org.thymeleaf.templateresolver.ServletContextTemplateResolver">

<beans:property name="prefix" value="/WEB-INF/templates/" />

<beans:property name="suffix" value=".html" />

<beans:property name="characterEncoding" value="UTF-8"/>

<beans:property name="templateMode" value="HTML5" />

<beans:property name="cacheable" value="false"/>

</beans:bean>

<beans:bean id="templateEngine" class="org.thymeleaf.spring3.SpringTemplateEngine">

<beans:property name="templateResolver" ref="templateResolver" />

</beans:bean>

<beans:bean class="org.thymeleaf.spring3.view.ThymeleafViewResolver">

<beans:property name="templateEngine" ref="templateEngine" />

<beans:property name="characterEncoding" value="UTF-8"/>

</beans:bean>

WEB-INF\views配下にjspがありますが、WEB-INF\templatesフォルダを作成し、その配下にhtmlファイルを置くように修正しています。

以下、home.htmlの例です。DOCTYPE宣言は必ず以下の通りにします。

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring3-3.dtd">
<html>
<head>
<title>Home</title>
</head>
<body>
<h1>
Hello world!
</h1>

<p th:utext="${serverTime}">thymeleaf. </p>
</body>
</html>

<!DOCTYPE html SYSTEM "http://www.thymeleaf.org/dtd/xhtml1-strict-thymeleaf-spring3-3.dtd">

<html>

<head>

</head>

<body>

<h1>

Hello world!

</h1>

<p th:utext="${serverTime}">thymeleaf. </p>

</body>

</html>

th:utextという属性はhtmlに直接アクセスされた場合は無視されます。その為、エクスプローラからアクセスした場合（直接htmlファイルにアクセス）pタグ内の文字が表示されます。

この属性は値の式を評価した結果をタグのボディに設定します。上記のhtmlの場合、thymeleaf.と置換されます。

HomeController.javaはSpringMVCProjectを作成した時のままです。

package jp.co.confrage;

import java.text.DateFormat;
import java.util.Date;
import java.util.Locale;

import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
import org.springframework.stereotype.Controller;
import org.springframework.ui.Model;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RequestMethod;

/**
* Handles requests for the application home page.
*/
@Controller
public class HomeController {

private static final Logger logger = LoggerFactory.getLogger(HomeController.class);

/**
* Simply selects the home view to render by returning its name.
*/
@RequestMapping(value = "/", method = RequestMethod.GET)
public String home(Locale locale, Model model) {
logger.info("Welcome home! The client locale is {}.", locale);

Date date = new Date();
DateFormat dateFormat = DateFormat.getDateTimeInstance(DateFormat.LONG, DateFormat.LONG, locale);

String formattedDate = dateFormat.format(date);

model.addAttribute("serverTime", formattedDate );

return "home";
}

}