SpringBoot MyBatis + 页面渲染

在 Spring Boot 中使用 MyBatis

我们用一个获取排行榜的小应用作为例子。

依赖与配置

  1. 引入所依赖的类库,在 MyBatis 的官网可以找到。接着引入 h2 数据库所需的类库。
<dependency>
    <groupId>org.mybatis.spring.boot</groupId>
    <artifactId>mybatis-spring-boot-starter</artifactId>
    <version>2.1.3</version>
</dependency>
<dependency>
    <groupId>com.h2database</groupId>
    <artifactId>h2</artifactId>
    <version>1.4.200</version>
</dependency>
  1. 配置 datasource
    对于 Spring Boot 来说,需要进行一些配置,将 application.properties 放在 src/main/resources 下。在官方文档中可以找到。
spring.datasource.url=jdbc:h2:file:./target/test
spring.datasource.username=root
spring.datasource.password=root
spring.datasource.driver-class-name=org.h2.Driver
  1. 配置 flyway 自动化迁移插件以及 sql 初始化语句
    在 src/main/resources/db/migration 下创建 V1__CreateTables.sql 用于初始化数据库(一定注意这里是两个下划线,踩过坑)。运行 mvn flyway:migrate 初始化数据库。这里不赘述细节。
create table user
(
    id bigint primary key auto_increment,
    name varchar(100)
)

create table match
(
    id bigint primary ket auto_increment,
    user_id bigint,
    score int
)

insert into user (id, name) values (1, 'AAA');
insert into user (id, name) values (2, 'BBB');
insert into user (id, name) values (3, 'CCC');

insert into match (id, user_id, score) values (1, 1, 1000);
insert into match (id, user_id, score) values (2, 1, 2000);
insert into match (id, user_id, score) values (3, 2, 500);
insert into match (id, user_id, score) values (4, 3, 300);
<plugin>
    <groupId>org.flywaydb</groupId>
    <artifactId>flyway-maven-plugin</artifactId>
    <version>7.4.0</version>
    <configuration>
        <url>jdbc:h2:file:./target/test</url>
        <user>root</user>
        <password>root</password>
    </configuration>
</plugin>
  1. 配置 MyBatis
    在 application.properties 中加入
mybatis.config-location = classpath:db/mybatis/config.xml

在 db/mybatis/config.xml 中写入 mybatis 配置,同样我们在官网抄。值得注意的是我们在Spring datasource中已经配置好了环境,所以mybatis中的<environments></environments> 环境配置部分可以全都不要。

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configuration
        PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <mappers>
            <mapper resource="db/mybatis/MyMapper.xml"/>
    </mappers>
</configuration>

两种方式使用 MyBatis

  1. 注解
    注意这里是接口不是类
@Mapper
public interface UserMapper {
    @Select("select * from user where id = #{id}")
    User getUserById(@Param("id") Integer id);
}

在config.xml 中加入mapper

<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE configuration
        PUBLIC "-//mybatis.org//DTD Config 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-config.dtd">
<configuration>
    <mappers>
        <mapper resource="db/mybatis/MyMapper.xml"/>
        <mapper class="hello.dao.UserMapper"/>
    </mappers>
</configuration>
@RestController
public class HelloController {
    @Autowired
    private UserMapper userMapper;

    @RequestMapping("/")
    @ResponseBody
    public Object index() {
        return userMapper.getUserById(1);
    }
}
  1. xml
    我们使用 xml 写好 mapper。
<?xml version="1.0" encoding="UTF-8" ?>
<!DOCTYPE mapper
        PUBLIC "-//mybatis.org//DTD Mapper 3.0//EN"
        "http://mybatis.org/dtd/mybatis-3-mapper.dtd">
<mapper namespace="MyMapper">
    <select id="selectRank" resultMap="rankItem">
        select user.id, user.name as name, total_score as score
        from
        (select user_id, sum(score) as total_score, from match group by user_id) m
        join user
        on m.user_id = user.id
    </select>
    <resultMap id="rankItem" type="hello.entity.RankItem">
        <result property="score" column="score"/>
        <association property="user" javaType="hello.entity.User">
            <result property="name" column="name"/>
            <result property="id" column="id"/>
        </association>
    </resultMap>
</mapper>

如何让 Spring 容器知道一个类是一个Bean(可以被注入,需要被注入等),一种简单的方法就是在 class 上使用注解 @Service 或者 @Component。换一句话说只有声明了 @Service,Bean才能被识别或是自动 Autowired。还有一种较为复杂的声明 Bean 的方式,这里先不展开。现在问题来了,我们知道在使用MyBatis时,我们需要一个 SqlSessionFactory 和一个 SqlSession 才能完成一系列 select 操作。但是在 Spring Boot 中这些东西从哪来呢?既然我们在使用 Spring,那么所有的依赖都需要 Spring 自动帮我们完成,这个时候非常简单。我们只需要自动注入一个 SqlSession 就好了,Spring 会自动帮你完成依赖的装配和注入,然后就直接用它吧。

@Service
public class RankDao {
    @Autowired
    private SqlSession sqlSession;

    public List<RankItem> getRank() {
        return sqlSession.selectList("MyMapper.selectRank");
    }
}
@Service
public class RankService {
    @Autowired
    private RankDao rankDao;

    public List<RankItem> getRank() {
        return rankDao.getRank();
    }
}
@RestController
public class HelloController {
    @Autowired
    private RankService rankService;

    @RequestMapping("/")
    @ResponseBody
    public Object index() {
        return rankService.getRank();
    }
}

页面渲染

后端渲染

我们考虑使用模板引擎,模板引擎有 freemaker、jsp、velocity 。目前最流行的模板引擎是 Freemaker。与 MyBatis 相似,Freemaker 也有一个 spring-boot-starter-freemaker 的依赖类库。我们需要在 resources/templates 目录下创建 .ftlh 格式的模板文件,还需要排行榜的数据。我们称这种响应 HTTP 的方式叫做 Model And View。有如下的写法:

// html.ftlh
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>排行榜</title>
</head>
<body>
    <table>
        <tr>
            <th>排名</th>
         <th>名字</th>
         <th>分数</th>
        </tr>
        <tr>
            <td>${index}</td>
            <td>${name}</td>
            <td>${score}</td>
        </tr>
    </table>
</body>
</html>
@RestController
public class HelloController {
    @RequestMapping("/")
    public ModelAndView index() {
        Map<String, Object> model = new HashMap<>();
        model.put("index", 1);
        model.put("name", "Zhang San");
        model.put("score", 1000);
        return new ModelAndView("index", model);
    }
}

根据 Freemaker 的语法,把所有数据填上去就可以了。

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>排行榜</title>
</head>
<body>
    <table>
        <tr>
           <th>排名</th>
           <th>名字</th>
           <th>分数</th>
        </tr>
        <#list items as item>
           <tr>
               <td>${item?index+1}</td>
               <td>${item.user.name}</td>
               <td>${item.score}</td>
           </tr>
        </#list>
    </table>
</body>
</html>
@RestController
public class HelloController {
    @Autowired
    private RankService rankService;

    @RequestMapping("/")
    public ModelAndView index() {
        List<RankItem> items = rankService.getRank();
        Map<String, List<RankItem>> model = new HashMap<>();
        model.put("items", items);
        return new ModelAndView("index", model);
    }
}

前段渲染

使用 JS 和 JSON 异步请求进行前端渲染。在 resources/static 下创建 index.html。Spring 规定在resource/static 目录下的文件可以直接访问。前端只需要用 ajax 访问某个接口获取数据,前端使用 js 动态的把数据加载到 html 上。

©著作权归作者所有,转载或内容合作请联系作者
  • 序言:七十年代末,一起剥皮案震惊了整个滨河市,随后出现的几起案子,更是在滨河造成了极大的恐慌,老刑警刘岩,带你破解...
    沈念sama阅读 212,185评论 6 493
  • 序言:滨河连续发生了三起死亡事件,死亡现场离奇诡异,居然都是意外死亡,警方通过查阅死者的电脑和手机,发现死者居然都...
    沈念sama阅读 90,445评论 3 385
  • 文/潘晓璐 我一进店门,熙熙楼的掌柜王于贵愁眉苦脸地迎上来,“玉大人,你说我怎么就摊上这事。” “怎么了?”我有些...
    开封第一讲书人阅读 157,684评论 0 348
  • 文/不坏的土叔 我叫张陵,是天一观的道长。 经常有香客问我,道长,这世上最难降的妖魔是什么? 我笑而不...
    开封第一讲书人阅读 56,564评论 1 284
  • 正文 为了忘掉前任,我火速办了婚礼,结果婚礼上,老公的妹妹穿的比我还像新娘。我一直安慰自己,他们只是感情好,可当我...
    茶点故事阅读 65,681评论 6 386
  • 文/花漫 我一把揭开白布。 她就那样静静地躺着,像睡着了一般。 火红的嫁衣衬着肌肤如雪。 梳的纹丝不乱的头发上,一...
    开封第一讲书人阅读 49,874评论 1 290
  • 那天,我揣着相机与录音,去河边找鬼。 笑死,一个胖子当着我的面吹牛,可吹牛的内容都是我干的。 我是一名探鬼主播,决...
    沈念sama阅读 39,025评论 3 408
  • 文/苍兰香墨 我猛地睁开眼,长吁一口气:“原来是场噩梦啊……” “哼!你这毒妇竟也来了?” 一声冷哼从身侧响起,我...
    开封第一讲书人阅读 37,761评论 0 268
  • 序言:老挝万荣一对情侣失踪,失踪者是张志新(化名)和其女友刘颖,没想到半个月后,有当地人在树林里发现了一具尸体,经...
    沈念sama阅读 44,217评论 1 303
  • 正文 独居荒郊野岭守林人离奇死亡,尸身上长有42处带血的脓包…… 初始之章·张勋 以下内容为张勋视角 年9月15日...
    茶点故事阅读 36,545评论 2 327
  • 正文 我和宋清朗相恋三年,在试婚纱的时候发现自己被绿了。 大学时的朋友给我发了我未婚夫和他白月光在一起吃饭的照片。...
    茶点故事阅读 38,694评论 1 341
  • 序言:一个原本活蹦乱跳的男人离奇死亡,死状恐怖,灵堂内的尸体忽然破棺而出,到底是诈尸还是另有隐情,我是刑警宁泽,带...
    沈念sama阅读 34,351评论 4 332
  • 正文 年R本政府宣布,位于F岛的核电站,受9级特大地震影响,放射性物质发生泄漏。R本人自食恶果不足惜,却给世界环境...
    茶点故事阅读 39,988评论 3 315
  • 文/蒙蒙 一、第九天 我趴在偏房一处隐蔽的房顶上张望。 院中可真热闹,春花似锦、人声如沸。这庄子的主人今日做“春日...
    开封第一讲书人阅读 30,778评论 0 21
  • 文/苍兰香墨 我抬头看了看天上的太阳。三九已至,却和暖如春,着一层夹袄步出监牢的瞬间,已是汗流浃背。 一阵脚步声响...
    开封第一讲书人阅读 32,007评论 1 266
  • 我被黑心中介骗来泰国打工, 没想到刚下飞机就差点儿被人妖公主榨干…… 1. 我叫王不留,地道东北人。 一个月前我还...
    沈念sama阅读 46,427评论 2 360
  • 正文 我出身青楼,却偏偏与公主长得像,于是被迫代替她去往敌国和亲。 传闻我的和亲对象是个残疾皇子,可洞房花烛夜当晚...
    茶点故事阅读 43,580评论 2 349

推荐阅读更多精彩内容