The startup of the Springboot service relies on a servlet container embedded within it, such as Tomcat or jetty, and typically runs the service as a jar, which causes an exception when you run the JSP. In addition to JSP, in the Springboot also have a better choice, that is thymeleaf.
1. New MAVEN Project
①. Create a projectNew MAVEN Project Spring-thymeleaf, the project structure is as follows:
②.pom DependenceThe pom.xml content of the Spring-thymeleaf project is as follows:
<project xmlns= "http://maven.apache.org/POM/4.0.0" xmlns:xsi= "Http://www.w3.org/2001/XMLSchema-instance" xsi: schemalocation= "http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd" > < Modelversion>4.0.0</modelversion> <groupId>net.xxpsw.demo</groupId> <artifactId> spring-thymeleaf</artifactid> <version>0.0.1-SNAPSHOT</version> <name>spring Boot thymeleaf</name> <description>spring Boot thymeleaf</description> <parent> <groupId> Org.springframework.boot</groupid> <artifactId>spring-boot-starter-parent</artifactId> < version>1.5.7.release</version> </parent> <properties> <project.build.sourceEncoding> Utf-8</project.build.sourceencoding> <project.reporting.outputencoding>utf-8</ Project.reporting.outputencoding> <java.version>1.8</java.version> </properties> < Dependencies> <dependency> <groupId>org.springframework.boot</groupId> <artifactid>spring-boot- starter-thymeleaf</artifactid> </dependency> </dependencies> <build> <plugins> ;p lugin> <groupId>org.springframework.boot</groupId> <artifactid>spring-boot-maven-plugin& lt;/artifactid> </plugin> </plugins> </build> </project>
The dependencies here only use the Spring-boot-starter-thymeleaf, which contains the spring-boot-starter-web.
③. Parameter ConfigurationThe package path for thymeleaf configuration parameters in Springboot is Org.springframework.boot.autoconfigure.thymeleaf.ThymeleafProperties, which has the following basic structure:
@ConfigurationProperties (prefix = "spring.thymeleaf") public class Thymeleafproperties {private static final Charset DEF
ault_encoding = Charset.forname ("UTF-8");
private static final MimeType Default_content_type = mimetype.valueof ("text/html");
public static final String Default_prefix = "classpath:/templates/";
public static final String Default_suffix = ". html";
Check that the template exists before rendering it (Thymeleaf 3+).
Private Boolean checktemplate = true;
Check that the templates location exists.
Private Boolean checktemplatelocation = true;
Prefix that gets prepended to view names when building a URL.
Private String prefix = default_prefix;
Suffix that gets appended to view names when building a URL.
Private String suffix = default_suffix; Template mode to is applied to templates.
Also standardtemplatemodehandlers.
Private String mode = "HTML5";
Template encoding.
Private Charset encoding = default_encoding;
Content-type value. Private MimeType contentType = Default_content_type;
Enable template caching.
Private Boolean cache = true;
Enable MVC thymeleaf View resolution.
Private Boolean enabled = TRUE; }
By the Thymeleafproperties class, The prefix for the thymeleaf parameter configuration item is spring.thymeleaf, and some parameter items have been configured with default values, such as the default template mode is HTML5, the default template encoding is UTF-8, and the default template file suffix is. html, and the default template file storage path is Classpath :/templates/, the default to open the template cache and so on. If you need to change these parameters, you can configure them in the Application.properties file, where you choose to use the default settings.
2.Thymeleaf Templates
①. static FilesFor ease of presentation, bootstrap and jquery are used here, and of course, these static files are not required and can be chosen according to the actual situation, static files are uniformly placed in the static directory under Resources, and the following additions are completed:
②. Page templateUnder Classpath:/templates/, create a new template file index01.html with the following file contents:
In the above file, xmlns:th= "http://www.thymeleaf.org" specifies a namespace that converts the lens page to a dynamic view, while @{} is used to refer to a static resource.
3. Data Display
①. New Control classThe new entity class student is as follows:
Package net.xxpsw.demo.springboot.thymeleaf.student;
public class Student {
/** ID *
/private Long ID;
/** name *
/private String name;
/** Age *
/private Integer;
/** Nationality *
/private String nat;
Public Student () {
super ();
}
Public Student (Long ID, string name, Integer age, String nat) {
super ();
This.id = ID;
this.name = name;
This.age = age;
This.nat = Nat;
}
Public Long GetId () {return
ID;
}
public void SetId (Long id) {
this.id = ID;
}
Public String GetName () {return
name;
}
public void SetName (String name) {
this.name = name;
}
Public Integer Getage () {return age
;
}
public void Setage (Integer age) {
this.age = age;
}
Public String Getnat () {return
nat;
}
public void Setnat (String nat) {
this.nat = nat;
}
}
The new control class Studentcontroller is as follows:
Package net.xxpsw.demo.springboot.thymeleaf.student;
Import Org.springframework.stereotype.Controller;
Import org.springframework.web.bind.annotation.RequestMapping;
@Controller
@RequestMapping ("student") public
class Studentcontroller {
}
②. Show model InformationAdd the following methods to the control class Studentcontroller:
@RequestMapping ("show01") public
String show01 (model model) {
model.addattribute ("Student", New Student (1L, " Jack ",", "" ");
return "index01";
}
The package path for Model in this method is Org.springframework.ui.Model.
Append the following to the <body></body> of the template file index01.html:
<div class= "Panel panel-primary" >
<div class= "panel-heading" >
Start the Springboot service, access the http://localhost:8080/student/show01 in the browser, and the page appears as follows:
③. Display list InformationAdd the following methods to the control class Studentcontroller:
@RequestMapping ("show02") public
String show02 (model model) {
list<student> students = new arraylist< > ();
Students.add (New Student (2L, "Mike", "USA"));
Students.add (New Student (3L, "Ice", num, "UK");
Model.addattribute ("Students", students);
return "index02";
}
Copy index01.html to index02.html under classpath:/templates/, modify <body></body> content as follows:
<div class= "Panel panel-primary" >
<div class= "panel-heading" >
Among them, Th:each is used to iterate the model.
Restart the Springboot service, access the http://localhost:8080/student/show02 in the browser, and the page appears as follows:
④. Access model in JavaScript add the following methods in the control class Studentcontroller:
@RequestMapping ("show03") public
String show03 (model model) {
model.addattribute ("Student", New Student (4L, " Geoff "," France ");
return "index03";
}
Copy index01.html to index03.html under classpath:/templates/, modify <body></body> content as follows:
<button class= "btn" th:onclick= "getmsg ()" "> Get information </button>
<script type=" Text/javascript "th:src = "@{/jquery-1.11.3.min.js}"/>
<script th:src= "@{/bootstrap/3.3.1/js/bootstrap.min.js}"/>
< Script th:inline= "javascript" >
function getmsg () {
var s = [[${student}]];
Alert (' ID: ' + s.id + ' | Name: ' + s.name + ' | Age: ' + s.age + ' | Nationality: ' + S.nat ');
}
</script>
Restart the Springboot service, access the http://localhost:8080/student/show03 in the browser, and the page appears as follows:
Click to get information, the page Flick window is as follows: