English | 简体中文 | 繁體中文 | Русский язык | Français | Español | Português | Deutsch | 日本語 | 한국어 | Italiano | بالعربية

Thymeleaf Spring Boot

Qu'est-ce que Thymeleaf ?

Thymeleaf C'est une bibliothèque Java open source basée sur licence Apache2.0 obtenir une licence. C'est une HTML5/XHTML/Pour HTML moteur de modèle. Il est utilisé pour les environnements Web (basé sur Servlet) et non Web ( hors ligne). template serveur JavaMoteur. Pour le HTML moderne5 Pour le développement Web JVM, c'est un choix parfait. Il fournit une intégration complète avec le framework Spring.

Il applique un ensemble de conversions aux fichiers de modèle pour afficher les données ou le texte générés par l'application. Il est adapté pour fournir XHTML dans les applications Web./HTML5.

L'objectif de Thymeleaf est de fournir une Modeet Bien formatémanière de créer des modèles. Il est basé sur les balises XML et les attributs. Ces balises XML définissent l'exécution de la logique prédéfinie sur le DOM (Document Object Model), plutôt que de la coder explicitement dans le modèle. Il remplace JSP .

L'architecture de Thymeleaf permet de rapide traitement, cela dépend de la file d'attente de résolution des fichiers de cache. Il utilise le moins d'I/Opération O.

Pourquoi utilisons-nous Thymeleaf ?

JSP est plus ou moins similaire à HTML. Mais il n'est pas complètement compatible avec HTML comme Thymeleaf. Nous pouvons ouvrir et afficher normalement les fichiers de modèle Thymeleaf dans le navigateur, mais les fichiers JSP ne peuvent pas.

Thymeleaf prend en charge les expressions de variables comme Spring EL ($ {...}) et les exécute sur les attributs du modèle, les expressions d'étoile (* {...}) est exécuté sur le bean de support de formulaire, l'expression de hachage (#{...}) est utilisée pour l'internationalisation, et l'expression de lien (@{......)) redéfinit l'URL.

Comme JSP, Thymeleaf peut être utilisé très bien pour les emails HTML riches.

Quels types de modèles peut traiter Thymeleaf ?

Thymeleaf peut traiter six types de modèles (également appelés" Modèle de template) comme suit:

Pour HTML XML valide XHTML XHTML valide HTML5 HTML ancienne version5

À l'exception de l'HTML ancienne version5En dehors de ce schéma, tous les autres schémas mentionnés XML bien définis Fichier. Il nous permet de traiter des HTML avec des balises indépendantes, des attributs de balises sans valeur ou des valeurs non encadrées entre guillemets.5Fichier.

Pour traiter les fichiers de ce format spécifique, Thymeleaf effectue une conversion, transformant les fichiers en XML bien formaté Fichier (HTML valide)5fichier).

Remarque: Dans Thymeleaf, la validation n'est applicable qu'aux modèles XHTML et XML.

Thymeleaf nous permet également de définir nos propres schémas de parsing du modèle en spécifiant deux. De cette manière, Thymeleaf peut traiter efficacement tout modèle qui peut être modélisé comme un arbre DOM.

Dialecte standard

Thymeleaf est un moteur de modèle qui nous permet de définir le cadre des nœuds DOM. Les nœuds DOM traités dans le modèle.

Les objets qui appliquent la logique aux nœuds DOM sont appelés processeurs. Un ensemble de processeurs et quelques artefacts supplémentaires sont appelés dialecte. Le dialecte qui contient la bibliothèque de base Thymeleaf est appelé Dialecte standard

Si nous voulons définir notre propre logique de traitement tout en profitant des fonctionnalités avancées de la bibliothèque, nous pouvons définir notre propre dialecte. Propre dialecte. Dans le moteur de modèle, nous pouvons configurer plusieurs dialectes en même temps.

Paquet d'intégration Thymeleaf (thymeleaf-spring3et thymeleaf-spring4) définit un nom appelé Dialecte SpringStandard du dialecte. Le dialecte standard et SpringStandard sont presque identiques. Cependant, le dialecte standard comporte quelques modifications mineures qui permettent de mieux utiliser certaines fonctionnalités du cadre Spring.

Par exemple, utiliser le langage d'expression Spring au lieu du dialecte standard OGNL (langage de navigation dans le graphique des objets) de Thymeleaf.

Le dialecte standard peut traiter les modèles de toutes les manières. Cependant, il est particulièrement adapté aux modèles orientés Web (HTML5et XHTML). Il prend en charge et vérifie les normes XHTML suivantes:

XHTML 1.0 version de transition XHTML strict 1.0 XHTML 1.0 ensemble de cadres XHTML 1.1.

Le processeur de dialecte standard est un processeur d'attribut qui permet au navigateur de visualiser l'HTML5/Fichier de modèle XHTML. Cela est dû au fait qu'ils ignorent d'autres attributs.

Par exemple, lorsque le fichier JSP utilise des bibliothèques de balises, il contient un code qui ne peut pas être affiché par le navigateur suivant:

<form:inputText name="student.Name" value="${student.name}" />

Le dialecte standard Thymeleaf nous permet d'atteindre la même fonctionnalité avec le code suivant.

<input type="text" name="student Name" value="Thomas" th:value="${student.name}" />

Le code ci-dessus nous permet également de définir value propriété( Thomas Lorsque vous ouvrez le prototype dans le navigateur, cette valeur sera affichée. Pendant le processus de traitement Thymeleaf du modèle, cette propriété sera remplacée par ${student.name} La valeur obtenue par la recherche remplace.

Les mêmes fichiers de modèle, ce qui réduit le travail nécessaire pour convertir un prototype statique en fichier de modèle de travail. Il est appelé Il permet aux concepteurs et aux développeurs de le traiter..

Modèle naturel

Caractéristiques Thymeleaf Il peut être utilisé à la fois dans un environnement réseau et dans un environnement non réseau.5/Pour HTML/XML Java moteur de modèle XHTML./Son cache de parsing élevé I O pour minimiser. Il peut être utilisé comme cadre de moteur de modèle si nécessaire.5. Il prend en charge plusieurs modèles de templates: XML, XHTML et HTML Il permet aux développeurs de les étendre et de créer des dialectes personnalisés. Il est basé sur un ensemble de fonctionnalités modulaires appelées dialectes.

Il prend en charge l'internationalisation.

Thymeleaf implémentation   spring-boot-starter-thymeleaf Pour réaliser le moteur de modèle Thymeleaf, nous devons ajouter une dépendance dans le fichier pom.xml de l'application.  /resource/Lisez les fichiers de modèle dans le répertoire templates.
<dependency>
<groupId>org.springframework.boot</<groupId>
<artifactId>spring-boot-starter-thymeleaf</artifactId>
</dependency>
 

Exemple Spring Boot Thymeleaf

Nous créons une application Spring Boot et réalisons le modèle Thymeleaf.

Étape1: Ouvrir Spring Initializr http://start.spring.io 。

Étape2: Choisir la version Spring Boot   2.3.0.M1.

Étape2: Fournir  GroupeNom. Nous avons fourni   com.w3codebox .

Étape3: Fournir  Artifacts ID. Nous avons fourni   spring-boot-thymeleaf-vue-example。

Étape5: Ajouter des dépendances   Spring Web et  Thymeleaf.

Étape6: Cliquez   Generate (Générer) bouton. Lorsque nous cliquons sur le bouton "Générer", il enveloppe les spécifications dans   Jar Téléchargez le fichier sur le système local.

Le7Étape: Extraire Fichier Jar et collez-le dans l'espace de travail STS.

Étape8: Importer Dossier de projet STS.

Fichier->Importer->Projets Maven existants->Parcourir->Choisir le dossier spring-boot-thymeleaf-vue-example->Terminé

L'importation nécessite un certain temps.

Étape9: Dans le paquet   com.w3codebox Créer une classe. Nous avons créé une classe nommée   Classe User.

Dans cette classe, nous avons définie deux variables   name et   email et génère   Getter et Setters.

User.java

package com.w3codebox;  
public class User 
{  
String name;  
String email;  
public String getName() 
{  
return name;  
}  
public void setName(String name) 
{  
this.name = name;  
}  
public String getEmail() 
{  
return email;  
}  
public void setEmail(String email) 
{  
this.email = email;  
}  
}
 

Étape10: Créer une classe contrôleur. Nous avons créé une classe nommée   DemoController est la classe contrôleur.

DemoController.java

package com.w3codebox;  
import org.springframework.web.bind.annotation.ModelAttribute;  
import org.springframework.web.bind.annotation.RequestMapping;  
import org.springframework.web.bind.annotation.RequestMethod;  
import org.springframework.web.servlet.ModelAndView;  
import org.springframework.stereotype.Controller;  
@Controller  
public class DemoController 
{  
@RequestMapping("/")  
public String index()
{  
return"index";  
}  
@RequestMapping(value="/save", method=RequestMethod.POST)  
public ModelAndView save(@ModelAttribute User user)
{  
ModelAndView modelAndView = new ModelAndView();  
modelAndView.setViewName("user"-data");      
modelAndView.addObject("user", user);    
return modelAndView;  
}  
}
 

L'étape suivante, nous allons créer un modèle Thymeleaf.

Étape11: }  intérieur du modèle(src/main/resources/Créez un dossier nommé   user-data Thymeleaf modèle.

Cliquez avec le bouton droit dans le dossier modèle->Nouveau->Autre->Fichier HTML->Suivant->Fournir un nom de fichier->Terminé

Remarque: N'oubliez pas d'implémenter le contenu suivant dans le fichier modèle.
<html lang="en" xmlns:th="http://www.thymeleaf.org">
 

user-data.html

<html xmlns:th="https://thymeleaf.org">  
<table>  
<tr>  
<td><h4>Nom d'utilisateur: </h4></td>  
<td><h4 th:text="${user.name}"></h4></td>  
</tr>  
<tr>  
<td><h4>ID Email: </h4></td>  
<td><h4 th:text="${user.email}"></h4></td>  
</tr>  
</table>  
</html>
 

Étape12: De même, créez un fichier dans le dossier modèle.   HTML fichier. Nous avons créé un fichier nommé   index fichier HTML.

index.html

<html lang="en">  
<head>  
<title>Page d'index </title>  
</head>  
<body>  
<form action="save" method="post">  
<table>  
<tr>  
<td><label for="user-name">Nom d'utilisateur </label></td>  
<td><input type="text" name="name"></input></td>  
 </tr>  
<tr>  
<td><label for="email">Email</label></td>  
<td><input type="text" name="email"></input></td>  
</tr>  
<tr>  
<td></td>  
<td><input type="submit" value="Soumettre"></input></td>  
</tr>  
</table>  
</form>  
</body>  
</html>
 

Étape13: Ouvrir   application.properties Créer un fichier et ajouter les propriétés suivantes à l'intérieur.

application.properties

spring.thymeleaf.cache=false
spring.thymeleaf.suffix:  .html
 

Après avoir créé tous les fichiers, dossiers et paquets, le répertoire du projet est le suivant:

Lançons l'application.

Étape14: Ouvrir   SpringBootThymeleafViewExampleApplication.java et le fichier en tant qu'application Java.

SpringBootThymeleafViewExampleApplication.java

package com.w3codebox;
import org.springframework.boot.SpringApplication;
import org.springframework.boot.autoconfigure.SpringBootApplication;
@SpringBootApplication
public class SpringBootThymeleafViewExampleApplication 
{
public static void main(String[] args) 
{
SpringApplication.run(SpringBootThymeleafViewExampleApplication.class, args);
}
}
 

Étape15: Maintenant, ouvrez le navigateur et appeler l'URL http://localhost:8080. Il affiche la sortie, comme suit.

Fournir  Nom d'utilisateuret  E-mail, puis cliquez  SoumettreBouton.

Cliquez  SoumettreBouton, le URL change en http://localhost: 8080/enregistrer et afficher les données utilisateur de l'utilisateur, comme suit.

Dans cette section, nous discutons des vues Thymeleaf. Pour rendre la vue plus attrayante, vous pouvez ajouter   CSS et   JS Les fichiers doivent être situés   src/main/resources/static dans le dossier.