美文网首页
Spring Boot整合模板引擎

Spring Boot整合模板引擎

作者: 泪已沾襟化作鸿 | 来源:发表于2017-11-22 11:48 被阅读0次

    一、FreeMarker模板引擎

    Spring Boot支持FreeMarker模板引擎,它是在Spring MVC基础上加入了自动配置的特性,在使用FreeMarker模板引擎的时候,需要在resources文件夹内建立static文件夹存放静态资源(一般包括css、images、js),还要建立一个templates文件,用于存放FreeMarker模板。

    1)依赖配置

    <?xml version="1.0" encoding="UTF-8"?>
    <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>springboot.example</groupId>
        <artifactId>springboot-freemarker</artifactId>
        <version>1.0-SNAPSHOT</version>
        <packaging>jar</packaging>
        <name>springboot-freemarker</name>
        <description>Spring Boot整合FreeMarker</description>
    
        <parent>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-parent</artifactId>
            <version>1.5.8.RELEASE</version>
            <relativePath/> <!-- lookup parent from repository -->
        </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-freemarker</artifactId>
            </dependency>
    
            <dependency>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-devtools</artifactId>
                <scope>runtime</scope>
            </dependency>
            <dependency>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-starter-test</artifactId>
                <scope>test</scope>
            </dependency>
    
            <dependency>
                <groupId>org.webjars</groupId>
                <artifactId>jquery</artifactId>
                <version>3.2.1</version>
            </dependency>
    
        </dependencies>
    
        <build>
            <plugins>
                <plugin>
                    <groupId>org.springframework.boot</groupId>
                    <artifactId>spring-boot-maven-plugin</artifactId>
                </plugin>
            </plugins>
        </build>
    
    </project>
    

    Spring Boot对静态资源友好z支持,包括对WebJars的支持也非常友好,这里也使用了WebJars。

    2)index.ftl模板

    <!DOCTYPE html>
    <html>
    <head lang="en">
        <title>Spring Boot Demo - FreeMarker</title>
    
        <link href="/css/index.css" rel="stylesheet"/>
    
    </head>
    <body>
    <center>
        <img src="/images/logo.png"/>
        <h1 id="title">${title}</h1>
    </center>
    
    <script type="text/javascript" src="/webjars/jquery/3.2.1/jquery.min.js"></script>
    
    <script>
        $(function () {
            $('#title').click(function () {
                alert('点击了');
            });
        })
    </script>
    </body>
    </html>
    

    上面jquery的资源就来自于WebJars,WebJars将常见的web静态资源封装到了jar包中,这样更加方便管理和版本控制。

    3)controller代码

    package com.lemon.springboot.controller;
    
    import org.springframework.stereotype.Controller;
    import org.springframework.ui.ModelMap;
    import org.springframework.web.bind.annotation.RequestMapping;
    import org.springframework.web.servlet.ModelAndView;
    
    /**
     * @author lemon
     */
    @Controller
    @RequestMapping("/web")
    public class WebController {
    
        @RequestMapping("/index")
        public ModelAndView index() {
            ModelAndView modelAndView = new ModelAndView();
            modelAndView.addObject("title", "Hello World");
            modelAndView.setViewName("index");
            return modelAndView;
        }
    
        @RequestMapping("/index1")
        public String index1(ModelMap modelMap) {
            modelMap.addAttribute("title", "Hello World!!!");
            return "index";
        }
    }
    

    注意:注解@Controller支持Model、ModelMap以及ModelAndView,如果是@RestController,将仅仅支持ModelAndView。

    二、Thymeleaf引擎模板

    Spring Boot默认使用的是Thymeleaf引擎模板,它的模板是HTML格式的,里面使用的th命名空间。使用方法和FreeMarker一模一样,只需要将FreeMarker的依赖改成Thymeleaf的依赖,将Thymeleaf的模板替换FreeMarker的模板即可。

    1)依赖

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

    2)模板

    <!DOCTYPE html>
    <html xmlns:th="http://www.w3.org/1999/xhtml">
    <head lang="en">
        <title>Spring Boot Demo - Thymeleaf</title>
        
        <link href="/css/index.css" rel="stylesheet" />
        
    </head>
    <body>
        <center>
            <img src="/images/logo.png" />
            <h1 id="title" th:text="${title}"></h1>
        </center>
        
        <script type="text/javascript" src="/webjars/jquery/3.2.1/jquery.min.js"></script>
        
        <script>
            $(function(){
                $('#title').click(function(){
                    alert('点击了');
                });
            })
        </script>
    </body>
    </html>
    

    相关文章

      网友评论

          本文标题:Spring Boot整合模板引擎

          本文链接:https://www.haomeiwen.com/subject/swynvxtx.html