Руководство: Thymeleaf + Spring. Часть 1
Введение в Thymeleaf
В этой статье продолжим разбирать приложение из предыдущего примера. На этот раз сосредоточимся на синтаксисе шаблонов Thymeleaf. В пример будет добавлена проверка поля и вывод в шаблон ошибок.
Maven-зависимость
Чтобы добавить Thymeleaf в Spring Boot приложение, мы прописали в POM-файле зависимость:
Отображение атрибутов модели
На главной странице мы добавляли в модель два атрибута: animals и animal:
animals – коллекция, animal объект.
В шаблоне атрибуты становятся переменными, к которым есть доступ.
Вообще наша страница выглядит так:
Как выглядит страница на основе шаблона index.html
В шаблоне выводится коллекция animals. А перед ней находится форма, которая через заполненный animal отправляет введенное название животного в контроллер.
th:each – отображение коллекции
Начнем с коллекции animals. Мы ее выводим в виде таблицы:
$ – это обращение к переменной, содержащей коллекцию. Строка
Здесь an – текущее животное, iterStat – итератор.
Из него можно получить индекс:
а также, является ли индекс нечетным числом:
th:style – задание стиля
Если является, ты мы задаем строке стиль:
Так все нечетные строки будут выделены жирным шрифтом.
th:text – отображение текста внутри тега
Как вывести имя животного? Для этого есть очень популярный атрибут th:text:
Он заполняет тег значением из переменной.
Если название животного – “козел”, то вышеприведенная запись преобразуется на итоговой странице в:
Перейдем к форме.
Обработка формы: th:action, th:object, th:field
Форма у нас обрабатывается благодаря трем атрибутам:
где первый атрибут th:action задает адрес /, по которому идет POST-запрос с формы, второй – объект Animal, а третий – его поле name, которое заполняется и передается в контроллер. Обратите внимание, что переменная $ задана в th:object, поэтому имя поля прописывается со звездочки.
Форма преобразуется в итоге:
th:value
Но можно обойтись без th:object, в этом случае тегу прописываем атрибут th:value:
Разницы нет, в обоих случаях в теле POST-запроса уходит name=значение, а итоговый :
Проверка поля и вывод ошибок – th:errors
Добавим в код проверку корректности введенного значения имени и вывод ошибок. Для этого придется поменять код в нескольких местах.
Модель – @NotBlank и @Size(min=2, max=50)
Во-первых, добавим для поля name модели условие, при котором оно считается корректным:
То есть поле name должно быть не пустым (не состоять из пробелов) и иметь размер от 2 до 50.
Чтобы аннотации @NotBlank и@Size(min=2, max=50) компилировались и обрабатывались, необходимо добавить Maven-зависимость:
@Valid и BindingResult в контроллере
Во-вторых, исправим контроллер.
Значение name должно проверяться, когда Animal приходит в контроллер в метод add().
Чтобы это происходило, аннотируем animal с помощью @Valid, а следующим аргументом добавим BindingResult (порядок важен):
Теперь перенаправление (“redirect:/”) на get() делаем только в случае успеха, иначе же просто возвращаем index.html с ошибками. Модель тоже надо заполнять, чтобы не терять список уже добавленных животных.
th:errors – вывод ошибок
После всех приготовлений вывести ошибки просто. Просто добавим под тег:
В итоге при попытке добавить пустую строку получим:
Вывод ошибок
Итоги
Код примера доступен на GitHub. В нем добавлена проверка поля и вывод ошибок, касающихся этого поля.
Пример Spring Boot + Spring Security + Thymeleaf
Сегодня дополним наш предыдущий урок Spring Boot и Thymeleaf JAR добавив Spring Sequrity.
Итак, собираем SPRING BOOT + SPRING SECURITY приложение в связке с встроенным сервером приложений Tomcat и движком шаблонов Thymeleaf в качестве исполняемого JAR-файла.
Технологии:
- Spring Boot 1.5.9.RELEASE
- Spring 4.3.13.RELEASE
- Spring Security 4.2.2
- Thymeleaf 2.1.5.RELEASE
- Thymeleaf extras Spring Security4 2.1.3
- Tomcat Embed 8.5.14
- Maven 3
- Java 8
1. Структура каталогов
2. Зависимости
Объявляем зависимость spring-boot-starter-security , она даст нам все необходимые инструменты для Spring Boot + Spring Security приложения.
Я как обычно использую Spring Initializr
spring boot security init
3. Spring Security
3.1 Наследуемся от WebSecurityConfigurerAdapter, и переопределяем правила безопасности в void configure(HttpSecurity http)
Подобные конфиги я обычно кладу в пакет config, в Spring MVC их было штуки 4
Для пользователя «admin»:
Разрешен доступ к странице /admin
Запрещен доступ к странице /user , будет перенаправлять на 403 access denied
Для пользователя «user»:
Разрешен доступ к странице /user
Запрещен доступ к странице /admin, будет перенаправлять на 403 access denied
Метод configure(HttpSecurity) определяет, какие URL пути должны быть защищены, а какие нет. В частности, «/» и «/home» настроены без требования к авторизации. Ко всем остальным путям должна быть произведена аутентификация.
Когда пользователь успешно войдет в систему, он будет перенаправлен на предыдущую запрашиваемую страницу, требующую авторизацию.
3.2 Наш кастомный 403 Access denied обработчик, логирует запрос и перенаправляет на /403
4. Spring Boot
4.1 Добавим контроллер, определим в нем имена вьюх и http запросы
В контроллере мы используем @GetMapping, по сути он эквивалентен @RequestMapping(method = RequestMethod.GET) но более лаконичен.
Так же бывают такие варианты:
4.2 Наша точка входа — сам Spring Boot application, если вы создавали проект в ручную
5. Thymeleaf + Resources + статические файлы
5.1 Для Thymeleaf файлов, создаем каталог в src/main/resources/templates/
5.2 Thymeleaf фрагменты, для шаблонов – header
5.3 Thymeleaf фрагменты, для макета шаблона – footer. Обратите внимание на тег sec, он очень полезен для отображения информации Spring Security в шаблонах, подробнее Thymeleaf extra Spring Security
5.4 Перечисляем Thymeleaf файлы и добавляем ссылки на страницы для более удобной навигации.
Spring Boot Web Thymeleaf + Spring Security
1. Посетите страницу Admin ( Защищено с помошью Spring Security , нужны права Администратора ( Admin Role ) )
2. Посетите страницу User ( Защищено с помошью Spring Security , нужны права пользователя ( User Role ) )
3. Посетите Открытую страницу ( доступна всем )
Admin page ( Spring Security protected )
User page ( Spring Security protected )
Normal page ( No need login )
Please Sign In
403 – Access is denied
4.2 Статические файлы, такие как стили CSS или Javascript кладем в /src/main/resources/static/
6. Запуск приложения
6.1 Запускаем приложение. Путь /admin/** защищен ,нам нужно войти в систему как админ что бы получить к нему доступ
6.2 Смотрим результат http://localhost:8080
6.3 Попытка доступа к http://localhost:8080/admin, автоматически отправляет нас на страницу авторизации http://localhost:8080/login
6.4 Не верный логин или пароль так же обрабатывается без нашего участия http://localhost:8080/login
6.5 При правильной авторизации нас автоматически направляет на страницу Админа http://localhost:8080/admin, к тому же мы избавились от дубликатов в написании header и footer благодаря фрагментам thymeleaf
6.6 А доступ к http://localhost:8080/user, по прежнему редиректит нас на 403 страницу http://localhost:8080/403 как мы и описывали в конфигурации Spring Security
6.7 Кликнув в низу страницы на ссылку sign out(выход), нас перенаправляет на http://localhost:8080/login?logout
Как видим и здесь Spring Security позаботился о нас
thymeleaf Начало работы с тимелеафом
замечания
Thymeleaf – это механизм шаблонов, библиотека, написанная в JAVA. Он позволяет разработчику определять шаблон страницы HTML, XHTML или HTML5, а затем заполнять его данными для создания конечной страницы. Поэтому реализует Model-View часть Model-View-Controller шаблон.
Важным принципом дизайна Тимелеафа является то, что сам шаблон должен быть правильно написан (X) HTML.
Версии
Представление формы Ajax с JQuery
Чтобы отправить форму через Ajax с помощью JQuery:
конфигурация
Чтобы начать работу с Thymeleaf, посетите официальную страницу загрузки .
Зависимость от Maven
Грейд-зависимость
Пример конфигурации
Начиная с версии 3.0, Thymeleaf поддерживает только конфигурацию Java.
В viewResolver() вы можете настроить, например, кодировку и тип содержимого для представлений. Дополнительная информация
В templateEngine() вы можете добавить специальные диалекты. Например, чтобы добавить engine.addDialect(new SpringSecurityDialect()); Spring Security, вы можете сделать это, как этот engine.addDialect(new SpringSecurityDialect());
Посмотрите на установщик для префикса и суффикса в методе templateResolver() . Он сообщает Тимелеафу, что каждый раз, когда контроллер вернет представление, Thymeleaf будет искать эти имена в html в каталоге webapp/views/ и добавлять к вам суффикс .html .
пример
Thymeleaf будет искать html с именем my-index.html в каталоге webapp/views/foo/ . В соответствии с приведенной выше конфигурацией.
Представление формы
Объект формы
контроллер
friendsForm.html
result.html
Замена фрагментов на ajax
Если вы хотите заменить части своего сайта, ajax – это простой способ сделать это.
На веб-сайте.html, где вы хотите заменить контент на основе выбранного значения:
И content.html с фрагментами, которые вы хотите включить, на основе выбранного значения:
И последнее, но не менее важное: Spring MVC ContentController.java :
Использование флажков
Пример метода в контроллере
Не используйте th:name для checboxes, просто name
