Перейти к основному содержимому

Движки шаблонов для Spring

· 8 мин. чтения

1. Обзор

Веб-инфраструктура Spring построена на основе шаблона MVC (Model-View-Controller), который упрощает разделение задач в приложении. Это дает возможность использовать различные технологии просмотра, от хорошо зарекомендовавшей себя технологии JSP до различных шаблонизаторов.

В этой статье мы рассмотрим основные шаблонизаторы, которые можно использовать с Spring, их конфигурацию и примеры использования.

2. Технологии Spring View

Учитывая, что проблемы в приложении Spring MVC четко разделены, переключение с одной технологии представления на другую в первую очередь является вопросом конфигурации.

Чтобы визуализировать каждый тип представления, нам нужно определить bean-компонент ViewResolver , соответствующий каждой технологии. Это означает, что мы можем затем вернуть имена представлений из методов сопоставления @Controller так же, как мы обычно возвращаем файлы JSP.

В следующих разделах мы рассмотрим более традиционные технологии, такие как Java Server Pages , а также основные механизмы шаблонов, которые можно использовать с Spring: Thymeleaf , Groovy , FreeMarker, Jade.

Для каждого из них мы рассмотрим конфигурацию, необходимую как для стандартного приложения Spring, так и для приложения, созданного с использованием Spring Boot .

3. Страницы Java-сервера

JSP — одна из самых популярных технологий просмотра для приложений Java, и она поддерживается Spring «из коробки». Для рендеринга файлов JSP обычно используется тип bean-компонента ViewResolverInternalResourceViewResolver :

@EnableWebMvc
@Configuration
public class ApplicationConfiguration implements WebMvcConfigurer {
@Bean
public ViewResolver jspViewResolver() {
InternalResourceViewResolver bean = new InternalResourceViewResolver();
bean.setPrefix("/WEB-INF/views/");
bean.setSuffix(".jsp");
return bean;
}
}

Затем мы можем начать создавать файлы JSP в папке /WEB-INF/views :

<%@ taglib prefix="form" uri="http://www.springframework.org/tags/form"%>
<html>
<head>
<meta http-equiv="Content-Type"
content="text/html; charset=ISO-8859-1">
<title>User Registration</title>
</head>
<body>
<form:form method="POST" modelAttribute="user">
<form:label path="email">Email: </form:label>
<form:input path="email" type="text"/>
<form:label path="password">Password: </form:label>
<form:input path="password" type="password" />
<input type="submit" value="Submit" />
</form:form>
</body>
</html>

Если мы добавляем файлы в приложение Spring Boot , то вместо класса ApplicationConfiguration мы можем определить следующие свойства в файле application.properties :

spring.mvc.view.prefix: /WEB-INF/views/
spring.mvc.view.suffix: .jsp

На основе этих свойств Spring Boot автоматически настроит необходимый ViewResolver .

4. Лист тимьяна

Thymeleaf — это механизм шаблонов Java, который может обрабатывать файлы HTML, XML, текст, JavaScript или CSS. В отличие от других шаблонизаторов, Thymeleaf позволяет использовать шаблоны в качестве прототипов, то есть их можно просматривать как статические файлы.

4.1. Зависимости Maven

Чтобы интегрировать Thymeleaf со Spring, нам нужно добавить зависимости thymeleaf и thymeleaf-spring4 :

<dependency>
<groupId>org.thymeleaf</groupId>
<artifactId>thymeleaf</artifactId>
<version>3.0.11.RELEASE</version>
</dependency>
<dependency>
<groupId>org.thymeleaf</groupId>
<artifactId>thymeleaf-spring5</artifactId>
<version>3.0.11.RELEASE</version>
</dependency>

Если у нас есть проект Spring 4, нам нужно добавить тимелеаф-спринг4 .

4.2. Весенняя конфигурация

Затем нам нужно добавить конфигурацию, для которой требуется bean-компонент SpringTemplateEngine , а также bean-компонент TemplateResolver , указывающий расположение и тип файлов представления.

SpringResourceTemplateResolver интегрирован с механизмом разрешения ресурсов Spring :

@Configuration
@EnableWebMvc
public class ThymeleafConfiguration {

@Bean
public SpringTemplateEngine templateEngine() {
SpringTemplateEngine templateEngine = new SpringTemplateEngine();
templateEngine.setTemplateResolver(thymeleafTemplateResolver());
return templateEngine;
}

@Bean
public SpringResourceTemplateResolver thymeleafTemplateResolver() {
SpringResourceTemplateResolver templateResolver
= new SpringResourceTemplateResolver();
templateResolver.setPrefix("/WEB-INF/views/");
templateResolver.setSuffix(".html");
templateResolver.setTemplateMode("HTML5");
return templateResolver;
}
}

Также нам нужен bean-компонент ViewResolver типа ThymeleafViewResolver :

@Bean
public ThymeleafViewResolver thymeleafViewResolver() {
ThymeleafViewResolver viewResolver = new ThymeleafViewResolver();
viewResolver.setTemplateEngine(templateEngine());
return viewResolver;
}

4.3. Шаблоны тимьяна

Теперь мы можем добавить файл HTML в папку WEB-INF/views :

<html>
<head>
<meta charset="ISO-8859-1" />
<title>User Registration</title>
</head>
<body>
<form action="#" th:action="@{/register}"
th:object="${user}" method="post">
Email:<input type="text" th:field="*{email}" />
Password:<input type="password" th:field="*{password}" />
<input type="submit" value="Submit" />
</form>
</body>
</html>

Шаблоны Thymeleaf очень похожи по синтаксису на шаблоны HTML.

Вот некоторые из функций, доступных при использовании Thymeleaf в приложении Spring:

  • поддержка определения поведения форм

  • привязка входных данных формы к моделям данных

  • проверка ввода формы

  • отображение значений из источников сообщений

  • рендеринг фрагментов шаблона

Подробнее об использовании шаблонов Thymeleaf можно прочитать в нашей статье Thymeleaf in Spring MVC .

4.4. Лист тимьяна в Spring Boot

Spring Boot обеспечит автоматическую настройку Thymeleaf , добавив зависимость spring-boot-starter-thymeleaf :

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
<version>2.5.6</version>
</dependency>

Никакой явной конфигурации не требуется. По умолчанию файлы HTML должны размещаться в папке ресурсов/шаблонов .

5. Свободный маркер

FreeMarker — это механизм шаблонов на основе Java, созданный Apache Software Foundation . Его можно использовать для создания веб-страниц, а также исходного кода, файлов XML, файлов конфигурации, электронных писем и других текстовых форматов.

Генерация выполняется на основе файлов шаблонов, написанных с использованием языка шаблонов FreeMarker .

5.1. Зависимости Maven

Чтобы начать использовать шаблоны в нашем проекте, нам нужна зависимость freemarker :

<dependency>
<groupId>org.freemarker</groupId>
<artifactId>freemarker</artifactId>
<version>2.3.23</version>
</dependency>

Для интеграции Spring нам также нужна зависимость spring-context-support :

<dependency>
<groupId>org.springframework</groupId>
<artifactId>spring-context-support</artifactId>
<version>5.2.8.RELEASE</version>
</dependency>

5.2. Весенняя конфигурация

Интеграция FreeMarker с Spring MVC требует определения bean-компонента FreemarkerConfigurer , который указывает расположение файлов шаблонов:

@Configuration
@EnableWebMvc
public class FreemarkerConfiguration {

@Bean
public FreeMarkerConfigurer freemarkerConfig() {
FreeMarkerConfigurer freeMarkerConfigurer = new FreeMarkerConfigurer();
freeMarkerConfigurer.setTemplateLoaderPath("/WEB-INF/views/");
return freeMarkerConfigurer;
}
}

Далее нам нужно определить соответствующий bean-компонент ViewResolver типа FreeMarkerViewResolver :

@Bean 
public FreeMarkerViewResolver freemarkerViewResolver() {
FreeMarkerViewResolver resolver = new FreeMarkerViewResolver();
resolver.setCache(true);
resolver.setPrefix("");
resolver.setSuffix(".ftl");
return resolver;
}

5.3. Шаблоны FreeMarker

Мы можем создать HTML-шаблон с помощью FreeMarker в папке WEB-INF/views :

<#import "/spring.ftl" as spring/>
<html>
<head>
<meta charset="ISO-8859-1" />
<title>User Registration</title>
</head>
<body>
<form action="register" method="post">
<@spring.bind path="user" />
Email: <@spring.formInput "user.email"/>
Password: <@spring.formPasswordInput "user.password"/>
<input type="submit" value="Submit" />
</form>
</body>
</html>

В приведенном выше примере мы импортировали набор макросов, определенных Spring для работы с формами в FreeMarker , включая привязку входных данных формы к моделям данных.

Также язык шаблонов FreeMarker содержит большое количество тегов, директив и выражений для работы с коллекциями, структурами управления потоком, логическими операторами, форматированием и разбором строк, чисел и многими другими функциями.

5.4. FreeMarker в Spring Boot

В приложении Spring Boot мы можем упростить необходимую настройку, используя зависимость spring-boot-starter-freemarker :

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-freemarker</artifactId>
<version>2.5.6</version>
</dependency>

Этот стартер добавляет необходимую автоконфигурацию. Все, что нам нужно сделать, это начать размещать наши файлы шаблонов в папке resources/templates .

6. Заводной

Представления Spring MVC также можно генерировать с помощью механизма шаблонов разметки Groovy . Этот движок основан на синтаксисе компоновщика и может использоваться для генерации любого текстового формата.

6.1. Зависимости Maven

В наш pom.xml необходимо добавить зависимость groovy-templates : ``

<dependency>
<groupId>org.codehaus.groovy</groupId>
<artifactId>groovy-templates</artifactId>
<version>2.4.12</version>
</dependency>

6.2. Весенняя конфигурация

Интеграция механизма шаблонов разметки с Spring MVC требует определения bean-компонента GroovyMarkupConfigurer и ViewResolver типа GroovyMarkupViewResolver :

@Configuration
@EnableWebMvc
public class GroovyConfiguration {

@Bean
public GroovyMarkupConfigurer groovyMarkupConfigurer() {
GroovyMarkupConfigurer configurer = new GroovyMarkupConfigurer();
configurer.setResourceLoaderPath("/WEB-INF/views/");
return configurer;
}

@Bean
public GroovyMarkupViewResolver thymeleafViewResolver() {
GroovyMarkupViewResolver viewResolver = new GroovyMarkupViewResolver();
viewResolver.setSuffix(".tpl");
return viewResolver;
}
}

6.3. Шаблоны разметки Groovy

Шаблоны написаны на языке Groovy и имеют несколько характеристик:

  • они скомпилированы в байт-код

  • они содержат поддержку фрагментов и макетов

  • они обеспечивают поддержку интернационализации

  • рендеринг быстрый

Давайте создадим шаблон Groovy для нашей формы «Регистрация пользователя», который включает привязки данных:

yieldUnescaped '<!DOCTYPE html>'                                                    
html(lang:'en') {
head {
meta('http-equiv':'"Content-Type" ' +
'content="text/html; charset=utf-8"')
title('User Registration')
}
body {
form (id:'userForm', action:'register', method:'post') {
label (for:'email', 'Email')
input (name:'email', type:'text', value:user.email?:'')
label (for:'password', 'Password')
input (name:'password', type:'password', value:user.password?:'')
div (class:'form-actions') {
input (type:'submit', value:'Submit')
}
}
}
}

6.4. Механизм шаблонов Groovy в Spring Boot

Spring Boot содержит автоконфигурацию для Groovy Template Engine , которая добавляется путем включения зависимости spring-boot-starter-groovy-templates :

<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-groovy-templates</artifactId>
<version>2.5.6</version>
</dependency>

Расположение шаблонов по умолчанию — /resources/templates .

7. Джейд4дж

Jade4j — это Java-реализация механизма шаблонов Pug (первоначально известного как Jade ) для Javascript. Шаблоны Jade4j можно использовать для создания файлов HTML.

7.1. Зависимости Maven

Для интеграции Spring нам нужна зависимость spring-jade4j :

<dependency>
<groupId>de.neuland-bfi</groupId>
<artifactId>spring-jade4j</artifactId>
<version>1.2.5</version>
</dependency>

7.2. Весенняя конфигурация

Чтобы использовать Jade4j с Spring, мы должны определить bean-компонент SpringTemplateLoader , который настраивает расположение шаблонов, а также bean-компонент JadeConfiguration :

@Configuration
@EnableWebMvc
public class JadeTemplateConfiguration {

@Bean
public SpringTemplateLoader templateLoader() {
SpringTemplateLoader templateLoader
= new SpringTemplateLoader();
templateLoader.setBasePath("/WEB-INF/views/");
templateLoader.setSuffix(".jade");
return templateLoader;
}

@Bean
public JadeConfiguration jadeConfiguration() {
JadeConfiguration configuration
= new JadeConfiguration();
configuration.setCaching(false);
configuration.setTemplateLoader(templateLoader());
return configuration;
}
}

Далее нам понадобится обычный bean-компонент ViewResolver , в данном случае типа JadeViewResolver :

@Bean
public ViewResolver viewResolver() {
JadeViewResolver viewResolver = new JadeViewResolver();
viewResolver.setConfiguration(jadeConfiguration());
return viewResolver;
}

7.3. Jade4j Шаблоны

Шаблоны Jade4j характеризуются простым в использовании синтаксисом, чувствительным к пробелам:

doctype html
html
head
title User Registration
body
form(action="register" method="post" )
label(for="email") Email:
input(type="text" name="email")
label(for="password") Password:
input(type="password" name="password")
input(type="submit" value="Submit")

Проект также предоставляет очень полезную интерактивную документацию , где вы можете просматривать вывод вашего шаблона по мере его написания.

Spring Boot не предоставляет стартер Jade4j , поэтому в проекте Boot нам пришлось бы добавить ту же конфигурацию Spring, как определено выше.

8. Другие шаблонизаторы

Помимо описанных выше механизмов шаблонов, есть еще несколько доступных, которые можно использовать.

Кратко рассмотрим некоторые из них.

Velocity — это более старый механизм шаблонов, который очень сложен, но имеет тот недостаток, что Spring устарел от его использования, начиная с версии 4.3, и полностью удален в Spring 5.0.1.

JMustache — это механизм шаблонов, который можно легко интегрировать в приложение Spring Boot с помощью зависимости spring-boot-starter-mustache .

Pebble поддерживает Spring и Spring Boot в своих библиотеках.

Также можно использовать другие библиотеки шаблонов, такие как Handlebars или React , работающие поверх обработчика сценариев JSR-223 , такого как Nashorn .

9. Заключение

В этой статье мы рассмотрели некоторые из самых популярных шаблонизаторов для веб-приложений Spring.

И, как всегда, полный исходный код примеров можно найти на GitHub .