Thymeleaf 2模板与Thymeleaf 3几乎100%兼容,因此只需在配置中进行一些修改即可。在这一小节中,我们将通过一个简单的示例(Hello World程序),演示如何配置和使用Thymeleaf。

    首先,打开Eclipse,创建一个Maven项目,如下所示 -

    1523793401200019.png

    设置工作目录(F:\worksp\thymeleaf),如下图所示 -

    1523793403648515.png

    选择一个原型(Archetype),这里选择:maven-archetype-webapp,如下图所示 -

    1523793406832972.png

    创建成功后,完整的项目目录结构如下 -

    1523793409887686.png

    Hello World示例使用以下组件库 -

    • Thymeleaf 3

    • Servlet 3

    Servlet3使用注解配置。

    下面分别来看看有关项目中的配置和代码 -

    文件:pom.xml -

    1. <project xmlns="http://maven.apache.org/POM/4.0.0" xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
    2. xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/maven-v4_0_0.xsd">
    3.  
    4. <modelVersion>4.0.0</modelVersion>
    5. <groupId>com.e-learn</groupId>
    6. <artifactId>helloworld</artifactId>
    7. <packaging>war</packaging>
    8. <version>0.0.1-SNAPSHOT</version>
    9. <name>Thymeleaf helloworld Maven Webapp</name>
    10. <url>http://maven.apache.org</url>
    11. <properties>
    12. <project.build.sourceEncoding>UTF-8</project.build.sourceEncoding>
    13. </properties>
    14.  
    15. <dependencies>
    16. <!-- Provided dependencies -->
    17. <dependency>
    18. <groupId>javax</groupId>
    19. <artifactId>javaee-web-api</artifactId>
    20. <version>7.0</version>
    21. <scope>provided</scope>
    22. </dependency>
    23. <!-- Compile dependencies -->
    24. <dependency>
    25. <groupId>org.thymeleaf</groupId>
    26. <artifactId>thymeleaf</artifactId>
    27. <version>3.0.7.RELEASE</version>
    28. </dependency>
    29. </dependencies>
    30. <build>
    31. <finalName>${project.artifactId}</finalName>
    32. <plugins>
    33. <plugin>
    34. <groupId>org.apache.tomcat.maven</groupId>
    35. <artifactId>tomcat7-maven-plugin</artifactId>
    36. <version>2.2</version>
    37. </plugin>
    38. </plugins>
    39. <defaultGoal>compile</defaultGoal>
    40. </build>
    41.  
    42. </project>

    文件:TemplateEngineUtil.java -

    1. package com.e-learn.thymeleaf3.config;
    2.  
    3. import javax.servlet.ServletContext;
    4. import javax.servlet.annotation.WebListener;
    5. import org.thymeleaf.TemplateEngine;
    6.  
    7. /**
    8. * Store and retrieves Thymeleaf TemplateEngine into the application servlet context.
    9. */
    10. @WebListener
    11. public class TemplateEngineUtil {
    12.  
    13. private static final String TEMPLATE_ENGINE_ATTR = "com.e-learn.thymeleaf3.TemplateEngineInstance";
    14.  
    15. public static void storeTemplateEngine(ServletContext context, TemplateEngine engine) {
    16. context.setAttribute(TEMPLATE_ENGINE_ATTR, engine);
    17. }
    18.  
    19. public static TemplateEngine getTemplateEngine(ServletContext context) {
    20. return (TemplateEngine) context.getAttribute(TEMPLATE_ENGINE_ATTR);
    21. }
    22.  
    23. }

    配置文件:ThymeleafConfig.java -

    1. package com.e-learn.thymeleaf3.config;
    2.  
    3. import javax.servlet.ServletContext;
    4. import javax.servlet.ServletContextEvent;
    5. import javax.servlet.ServletContextListener;
    6. import javax.servlet.annotation.WebListener;
    7. import org.thymeleaf.TemplateEngine;
    8. import org.thymeleaf.templatemode.TemplateMode;
    9. import org.thymeleaf.templateresolver.ITemplateResolver;
    10. import org.thymeleaf.templateresolver.ServletContextTemplateResolver;
    11.  
    12. /**
    13. * Thymeleaf configuration.
    14. */
    15. @WebListener
    16. public class ThymeleafConfig implements ServletContextListener {
    17.  
    18. public void contextInitialized(ServletContextEvent sce) {
    19. TemplateEngine engine = templateEngine(sce.getServletContext());
    20. TemplateEngineUtil.storeTemplateEngine(sce.getServletContext(), engine);
    21. }
    22.  
    23. public void contextDestroyed(ServletContextEvent sce) {
    24. }
    25.  
    26. private TemplateEngine templateEngine(ServletContext servletContext) {
    27. TemplateEngine engine = new TemplateEngine();
    28.  
    29. engine.setTemplateResolver(templateResolver(servletContext));
    30. return engine;
    31. }
    32.  
    33. private ITemplateResolver templateResolver(ServletContext servletContext) {
    34. ServletContextTemplateResolver resolver = new ServletContextTemplateResolver(servletContext);
    35. resolver.setPrefix("/WEB-INF/templates/");
    36. resolver.setCharacterEncoding("UTF-8");
    37. resolver.setTemplateMode(TemplateMode.HTML);
    38. return resolver;
    39. }
    40.  
    41. }

    Servlet入口文件:IndexServlet.java -

    1. package com.e-learn.thymeleaf3.web;
    2.  
    3. import com.e-learn.thymeleaf3.config.TemplateEngineUtil;
    4. import java.io.IOException;
    5. import javax.servlet.annotation.WebServlet;
    6. import javax.servlet.http.HttpServlet;
    7. import javax.servlet.http.HttpServletRequest;
    8. import javax.servlet.http.HttpServletResponse;
    9. import org.thymeleaf.TemplateEngine;
    10. import org.thymeleaf.context.WebContext;
    11.  
    12.  
    13. @WebServlet("/")
    14. public class IndexServlet extends HttpServlet {
    15.  
    16. @Override
    17. protected void doGet(HttpServletRequest request, HttpServletResponse response) throws IOException {
    18. TemplateEngine engine = TemplateEngineUtil.getTemplateEngine(request.getServletContext());
    19. WebContext context = new WebContext(request, response, request.getServletContext());
    20. response.setCharacterEncoding("utf-8");
    21. context.setVariable("recipient", "e-learn");
    22. engine.process("index.html", context, response.getWriter());
    23. }
    24.  
    25. }

    模板文件:index.html -

    1. <!DOCTYPE html>
    2. <html xmlns="http://www.w3.org/1999/xhtml" xmlns:th="http://www.thymeleaf.org">
    3. <head>
    4. <meta charset="UTF-8" />
    5. <title>Thymeleaf3 + Servlet3 示例</title>
    6. </head>
    7. <body>
    8. <h1>Thymeleaf 3 + Servlet 3 示例</h1>
    9. <p>
    10. Hello <span th:text="${recipient}"></span>!
    11. </p>
    12. </body>
    13. </html>

    使用Maven构建和运行应用程序的最简单方法是执行mvn tomcat7:run,或者如果按照本教程使用Eclipse创建Maven项目,那么可通过右键项目名称,选择:Run As -> Maven install,构建安装生成后再右键项目名称,选择:Run As -> Run On Server,并在浏览器中访问URL: http://localhost:8080/helloworld ,得到以下结果 -

    QQ截图20190924114711.jpg

    这样,我们的第一个Thymeleaf入门应用就完成了~!