Руководство: Thymeleaf + Spring. Часть 3

Пример 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 позаботился о нас

Soft, интернет, безопасность: новости, статьи, советы, работа

Избранное сообщение

Фетісов В. С. Комп’ютерні технології в тестуванні. Навчально-методичний посібник. 2-ге видання, перероблене та доповнене / Мои публикации

В 10-х годах я принимал участие в программе Европейского Союза Tempus “Освітні вимірювання, адаптовані до стандартів ЄС”. В рамк.

вторник, 29 января 2019 г.

Руководство: Thymeleaf + Spring. Часть 3 / Программирование на Java

7 Проверка и сообщения об ошибках

7.1 Field errors

Давайте посмотрим, как мы можем установить конкретный класс CSS для поля, если оно содержит ошибку:

Как видите, функция #fields.hasErrors(…) получает выражение поля в качестве параметра (datePlanted) и возвращает логическое значение, указывающее, существуют ли какие-либо ошибки проверки для этого поля.

Мы также можем получить все ошибки для этого поля и повторить их:

Вместо итерации мы могли бы также использовать th:errors, специализированный атрибут, который создает список со всеми ошибками для указанного селектора, разделенными
:

Упрощение стилей CSS на основе ошибок: th:errorclass

Пример, который мы видели выше, установка CSS-класса для input формы, если в этом поле есть ошибки, настолько распространена, что Thymeleaf предлагает специальный атрибут для точного выполнения: th:errorclass.

Примененный к тегу поля формы (input, select, textarea…), он будет считывать имя поля, которое нужно проверить, из любых существующих атрибутов name или th:field в том же теге, а затем добавлять указанный класс CSS к тегу, если такое поле имеет какие-либо связанные ошибки:

Если в datePlanted есть ошибки, это будет выглядеть так:

7.2 Все ошибки

А что если мы хотим показать все ошибки в форме? Нам просто нужно запросить методы #fields.hasErrors(…) и #fields.errors(…) с константами ‘*‘ или ‘all‘ (которые эквивалентны):

Как и в приведенных выше примерах, мы могли бы получить все ошибки и итерировать по ним …

… а также создать разделенный
список:

Наконец, обратите внимание, что #fields.hasErrors(‘*’) эквивалентно #fields.hasAnyErrors(), и #fields.errors(‘*’) эквивалентно #fields.allErrors(). Используйте тот синтаксис, который вы предпочитаете:

7.3 Глобальные ошибки

В форме Spring существует третий тип ошибок: глобальные ошибки. Это ошибки, которые не связаны с какими-либо конкретными полями в форме, но все еще существуют.
Thymeleaf предлагает константу global для доступа к этим ошибкам:

… a также эквивалентные вспомогательные методы #fields.hasGlobalErrors() и #fields.globalErrors():

7.4 Отображение ошибок вне форм

Ошибки проверки формы также могут отображаться вне форм с помощью переменных ($ ) вместо выражений выбора (* ) и префикса имени компонента, поддерживающего форму:

7.5 Богатые объекты ошибок

Thymeleaf предлагает возможность получения информации об ошибках формы в виде bean-компонентов (вместо простых строк) с атрибутами fieldName (String), message (String) и global(boolean).

Эти ошибки могут быть получены с помощью служебного метода #fields.detailedErrors():

8 Это все еще прототип!

Наше приложение готово. Но давайте еще раз посмотрим на .html страницу, которую мы создали …

Одним из самых приятных последствий работы с Thymeleaf является то, что после всех этих функций, которые мы добавили в наш HTML, мы все равно можем использовать этот HTML в качестве прототипа (мы говорим, что это Natural Template). Давайте откроем seedstartermng.html прямо в нашем браузере, не запуская наше приложение:

Вот оно! Это не работающее приложение, это не реальные данные … но это совершенно правильный прототип, составленный из прекрасно отображаемого HTML-кода.

Читать еще: Avast представила защищенный браузер Avast Secure Browser - CNews

9 Служба конверсии (The Conversion Service)

9.1 Конфигурирование

Как объяснялось ранее, Thymeleaf может использовать Службу преобразования, зарегистрированную в контексте приложения. Наш класс конфигурации приложения, расширяя собственный помощник Spring WebMvcConfigurerAdapter, автоматически зарегистрирует такой сервис преобразования, который мы можем настроить, добавив необходимые средства форматирования. Давайте еще раз посмотрим, как это выглядит:

9.2 Синтаксис двойной скобки

Служба преобразования может быть легко применена для преобразования/форматирования любого объекта в строку. Это делается с помощью синтаксиса выражений в двойных скобках:

Для переменных выражений: $<<…>>
Для выражения выбора: *<<…>>

Так, например, учитывая преобразователь Integer-to-String, который добавляет запятые в качестве разделителя тысяч, это:

… должно привести к:

9.3 Использование в формах

Ранее мы видели, что каждый атрибут th:field всегда будет применять сервис преобразования, так что это:

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

9.4 #conversions объект преобразования

Служебный объект преобразования #conversions позволяет вручную запускать службу преобразования там, где это необходимо:

Синтаксис для этого служебного объекта:

#conversions.convert(Object, Class): преобразует объект в указанный класс
#conversions.convert(Object, String): то же, что и выше, но с указанием целевого класса в виде String (обратите внимание, что пакет java.lang. может быть опущен)

10 Отрисовка фрагментов шаблона Template Fragments (AJAX etc)

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

Это может быть полезным инструментом компонентизации. Например, его можно использовать на контроллерах, которые выполняются при вызовах AJAX, которые могут возвращать фрагменты разметки страницы, которая уже загружена в браузер (для обновления выбора, включения/выключения кнопок…).

Фрагментарный рендеринг может быть достигнут с использованием спецификаций фрагментов Thymeleaf: объектов, реализующих интерфейс org.thymeleaf.fragment.IFragmentSpec.

Наиболее распространенной из этих реализаций является org.thymeleaf.standard.fragment.StandardDOMSelectorFragmentSpec, которая позволяет указывать фрагмент с помощью селектора DOM в точности так же, как те, что используются в th:include или th:replace.

10.1 Определение фрагментов в бине представления

Bean-компоненты представления — это bean-компоненты класса org.thymeleaf.spring4.view.ThymeleafView, объявленные в контексте приложения (аннотация Bean, если вы используете конфигурацию Java). Они позволяют задавать фрагменты следующим образом:

Учитывая приведенное выше определение bean-компонента, если наш контроллер возвращает content-part (имя вышеупомянутого bean-компонента)…

… Thymeleaf вернет только фрагмент content шаблона индекса — расположение которого, вероятно, будет примерно таким же, как /WEB-INF/templates/index.html, после применения префикса и суффикса. Таким образом, результат будет полностью эквивалентен указанию index :: content:

Также обратите внимание, что благодаря мощным селекторам разметки Thymeleaf мы можем выделять фрагмент в шаблоне без каких-либо атрибутов th:fragment. Давайте используем атрибут id, например:

10.2 Определение фрагментов в возвращаемом значении контроллера

Вместо декларирования view beans, фрагменты могут быть определены из контроллера с использованием синтаксиса выражений фрагментов (fragment expressions). Просто как в аттрибутах th:insert или th:replace.

Разумеется, снова доступна вся мощь селекторов DOM, поэтому мы можем выбрать наш фрагмент на основе стандартных атрибутов HTML, таких как id=«content»:

И мы также можем использовать параметры, такие как:

11 Продвинутые интеграционные фичи

11.1 Интеграция с RequestDataValueProcessor

Thymeleaf легко интегрируется с интерфейсом Spring RequestDataValueProcessor. Этот интерфейс позволяет перехватывать URL-адреса ссылок, URL-адреса формы и значения полей формы до их записи в результат разметки, а также прозрачно добавлять скрытые поля формы, которые включают функции безопасности, например, такие как: защита против CSRF (подделка межсайтовых запросов).

Реализация RequestDataValueProcessor может быть легко настроена в контексте приложения. Он должен реализовать интерфейс org.springframework.web.servlet.support.RequestDataValueProcessor и иметь requestDataValueProcessor в качестве имени бина:

…и Thymeleaf будет использовать это следующим образом:

th:href и th:src вызывают RequestDataValueProcessor.processUrl(…) перед отрисовкой URL
th:action вызывает RequestDataValueProcessor.processAction(…) перед рендерингом атрибута action формы, и дополнительно он обнаруживает, когда этот атрибут применяется к тегу
th:value вызывает RequestDataValueProcessor.processFormFieldValue(…) для отрисовки значения, на которое оно ссылается, если только в том же теге нет th:field (в этом случае th:field сам позаботится)
th:field вызывает RequestDataValueProcessor.processFormFieldValue(…) для отрисовки значения поля, к которому применяется (или тела тега, если им является )

Обратите внимание, что существует очень мало сценариев, в которых вам нужно было бы явно реализовать RequestDataValueProcessor в вашем приложении. В большинстве случаев это будет автоматически использоваться библиотеками безопасности, которые вы прозрачно используете, например, например, Spring Security’s CSRF.

11.1 Построение URIs к контроллерам

Начиная с версии 4.1, Spring дает возможность создавать ссылки на аннотированные контроллеры непосредственно из представлений, без необходимости знать URI, на которые эти контроллеры отображаются.

В Thymeleaf это может быть достигнуто с помощью выражения #mvc.url(…), который позволяет задавать методы контроллера заглавными буквами класса контроллера, в котором они находятся, за которым следует имя метода. Это эквивалентно пользовательской функции spring:mvcUrlx(…) в JSP.

Следующий код создаст ссылки на методы:

12 Spring WebFlow интеграция

Интеграционные пакеты Thymeleaf + Spring включают интеграцию с Spring WebFlow (2.3+).

WebFlow включает некоторые возможности AJAX для рендеринга фрагментов отображаемой страницы при срабатывании определенных событий (переходов), и чтобы Thymeleaf мог отслеживать эти запросы AJAX, нам нужно будет использовать другую реализацию ViewResolver, настроенную так:

… и тогда этот ViewResolver может быть сконфигурирован в WebFlow ViewFactoryCreatorкак:

Отсюда вы можете определить шаблоны Thymeleaf в вашем view-state’s:

В приведенном выше примере bookingDetail — это шаблон Thymeleaf, указанный обычным способом, понятный любому из резолверов шаблона, настроенных в TemplateEngine.

12.2 AJAX фрагменты в Spring WebFlow

Обратите внимание, что здесь объясняется только способ создания фрагментов AJAX для использования с Spring WebFlow. Если вы не используете WebFlow, создание контроллера Spring MVC, который отвечает на запрос AJAX и возвращает кусок HTML, так же просто, как и создание любого другого контроллера, возвращающего шаблон, с единственным исключением, что вы, вероятно, будете возвращать фрагмент наподобие “main :: admin” из вашего метода контроллера.

WebFlow позволяет определить отрисовку через AJAX с тегов, например так:

Эти фрагменты (в данном случае hoteldata) могут представлять собой разделенный запятыми список фрагментов, указанных в разметке с помощью th:fragment:

Всегда помните, что указанные фрагменты должны иметь атрибут id, чтобы библиотеки Spring JavaScript, работающие в браузере, могли заменить разметку.

Теги также можно указывать с помощью селекторов DOM:

…и это означает, что нет нужды в th:fragment:

Что касается кода, который запускает переход updateData, он выглядит следующим образом:

Spring Boot Hello World Example – Thymeleaf

In this article, we will show you how to develop a Spring Boot web application, using Thymeleaf view, embedded Tomcat and package it as an executable JAR file.

Spring Boot 2.1.2.RELEASE
Spring 5.1.4.RELEASE
Thymeleaf 3.0.11.RELEASE
Tomcat embed 9.0.14
JUnit 4.12
Maven 3
Java 8

1. Project Directory

2. Maven

Put spring-boot-starter-web and spring-boot-starter-thymeleaf , it will get anything we need to develop a Spring MVC + Thymeleaf web application, including the embedded Tomcat server.

Display the project dependencies.

3. Developer Tools

This spring-boot-devtools helps to disable the caches and enable hot swapping so that developers will always see the last changes. Good for development. Read this – Spring Boot – Developer tools Try to modify the Thymeleaf templates or properties files, refresh the browser to see the changes take effect immediately.

For Eclipse IDE, it is integrated well with spring-boot-devtools .
For Intellij IDEA, extra steps are required, read this reload static file is not working

4. Spring Boot + MVC

4.1 A simple controller.

4.2 Create a class and annotate with @SpringBootApplication . In IDE, run this class to start the entire web application.

5. Thymeleaf + Static files

5.1 For Thymeleaf template files, put in src/main/resources/templates/

5.3 For Static files like CSS or JS, put in src/main/resources/static/

6. Unit Test

MockMvc to test the Spring MVC controller.

7. Demo

8. Create an executable JAR

For deployment, just normal Maven package to create an executable JAR file.

Download Source Code

References

mkyong

Comments

Hi, what is the correct way to change the .html files path? I want them inside webapp/WEB-INF/templates. I’ve tried with the templateResolver setPrefix official thymeleaf doc, adding at my application.yml the spring:thymeleaf:prefix: classpath:WEB-INF/templates (without classpath…) with another @bean definitios in stackoverflow but not working in any way… Any idea or advice?

did you try spring.mvc.view.prefix

Why I am getting 404 error

article is updated, try again with mvn spring-boot:run

only Return…. welcome message not welcome.html page….

Use @Controller and not @RestController

I built my project exactly same as explained here. but I keep getting the whitelabel error page 404.

To those having errors with this example, simple comment out this dependency line of code from your “pom.xml” file
Then, build and Run your application.

org.springframework.boot
spring-boot-devtools
true

Change @Controller to @RestController in the controller file.

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

HTML Form Handling in Thymeleaf and Spring Boot

Thymeleaf is a popular server-side template engine for Java-based web applications. In this article, you’ll learn how to create HTML forms in Thymeleaf and how to handle the form submission on the backend using Spring Boot. If you need more information on working with Thymeleaf in Spring Boot, take a look at this guide.

Thymeleaf completely supports HTML5, so you can easily create a complex HTML form and handle the submission through the Spring Boot controller. For this article, I’ll cover all the core HTML form elements such as inputs, text areas, checkboxes, radio buttons, and dropdowns.