1

Web页面内容展示

在之前的示例中,我们都是通过@RestController来处理请求,所以返回的内容为json对象。我们现在需要实现更复杂的页面显示,就需要用到模板引擎来帮我实现了。

Spring Boot默认提供静态资源目录位置需置于classpath下,目录名需符合如下规则:

/static
/public
/resources
/META-INF/resources

例如:我们在src/main/resources/目录下创建static,并在该位置放置一个图片文件A.jpg。启动程序后,访问http://localhost:8080/A.jpg。如能显示图片,则配置成功。

模板引擎

在动态HTML实现上Spring Boot依然可以完美胜任,并且提供了多种模板引擎的默认配置支持,所以在推荐的模板引擎下,我们可以很快的上手开发动态网站。

Spring Boot提供了默认配置的模板引擎主要有以下几种:

Thymeleaf
FreeMarker
Velocity
Groovy
Mustache

在这里我们发现没有我们曾经最熟悉的JSP,那是因为JSP无法实现Spring Boot的多种特性,如果非要使用JSP,也是可以通过配置进行实现的。后面我们再说。

Thymeleaf是一种简单且容易上手的模板引擎,我们现在就选择它来进行具体的介绍吧!

Thymeleaf

我们根据上一篇文章新建一个项目,在选择依赖的时候需要选择Web和Thymeleaf即可。

clipboard.png

打开pom.xml文件我们可以看到引入的依赖。

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

在Spring Boot中使用Thymeleaf,只需要引入上面的依赖,并在默认的模板路径src/main/resources/templates下编写模板文件即可完成。

clipboard.png

下面我们来简单的写一个示例:

  • 第一,我们先在src/main/resources/templates这个目录下面添加一个index.html的HTML文件。
<!DOCTYPE html>
<html lang="en" xmlns:th="http://www.thymeleaf.org">
<head>
    <meta charset="UTF-8">
    <title>测试页面</title>
</head>
<body>
    <h1 th:text="${newWorld}">Hello World</h1>
</body>
</html>
注意:如果想要使用模板引擎的话,就需要在页面引用thymeleaf语法空间。就是xmlns:th="http://www.thymeleaf.org",thymeleaf的语法就是th:xxxx=“数据”,具体可以看官方说明文档。
  • 第二,我们需要写controller来实现页面的跳转
@RequestMapping("/index")
    public String index(ModelMap map){
        map.addAttribute("newWorld","WELCOME TO NEW WORLD!!!");
        return "index";
    }
  • 第三,我们首先打开index.html文件查看显示的内容。

clipboard.png

运行项目,输入项目地址再次查看页面显示内容,内容被替换了。

clipboard.png

Thymeleaf的默认参数配置

在application.yml中可以配置thymeleaf模板解析器属性

# THYMELEAF (ThymeleafAutoConfiguration)
#开启模板缓存(默认值:true)
spring.thymeleaf.cache=true 
#Check that the template exists before rendering it.
spring.thymeleaf.check-template=true 
#检查模板位置是否正确(默认值:true)
spring.thymeleaf.check-template-location=true
#Content-Type的值(默认值:text/html)
spring.thymeleaf.content-type=text/html
#开启MVC Thymeleaf视图解析(默认值:true)
spring.thymeleaf.enabled=true
#模板编码
spring.thymeleaf.encoding=UTF-8
#要被排除在解析之外的视图名称列表,用逗号分隔
spring.thymeleaf.excluded-view-names=
#要运用于模板之上的模板模式。另见StandardTemplate-ModeHandlers(默认值:HTML5)
spring.thymeleaf.mode=HTML5
#在构建URL时添加到视图名称前的前缀(默认值:classpath:/templates/)
spring.thymeleaf.prefix=classpath:/templates/
#在构建URL时添加到视图名称后的后缀(默认值:.html)
spring.thymeleaf.suffix=.html
#Thymeleaf模板解析器在解析器链中的顺序。默认情况下,它排第一位。顺序从1开始,只有在定义了额外的TemplateResolver Bean时才需要设置这个属性。
spring.thymeleaf.template-resolver-order=
#可解析的视图名称列表,用逗号分隔
spring.thymeleaf.view-names=

周兆东
107 声望21 粉丝

一个java小白的成长之路。。。