SpringBoot MyBatis + 頁(yè)面渲染

在 Spring Boot 中使用 MyBatis

我們用一個(gè)獲取排行榜的小應(yīng)用作為例子球榆。

依賴與配置

  1. 引入所依賴的類庫(kù)蛔溃,在 MyBatis 的官網(wǎng)可以找到幔虏。接著引入 h2 數(shù)據(jù)庫(kù)所需的類庫(kù)胸梆。
<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
    對(duì)于 Spring Boot 來(lái)說(shuō)硼控,需要進(jìn)行一些配置蚁飒,將 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 自動(dòng)化遷移插件以及 sql 初始化語(yǔ)句
    在 src/main/resources/db/migration 下創(chuàng)建 V1__CreateTables.sql 用于初始化數(shù)據(jù)庫(kù)(一定注意這里是兩個(gè)下劃線,踩過(guò)坑)线婚。運(yùn)行 mvn flyway:migrate 初始化數(shù)據(jù)庫(kù)遏弱。這里不贅述細(xì)節(jié)。
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 配置塞弊,同樣我們?cè)?a target="_blank">官網(wǎng)抄漱逸。值得注意的是我們?cè)赟pring datasource中已經(jīng)配置好了環(huán)境,所以mybatis中的<environments></environments> 環(huán)境配置部分可以全都不要游沿。

<?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 容器知道一個(gè)類是一個(gè)Bean(可以被注入,需要被注入等)诀黍,一種簡(jiǎn)單的方法就是在 class 上使用注解 @Service 或者 @Component袋坑。換一句話說(shuō)只有聲明了 @Service,Bean才能被識(shí)別或是自動(dòng) Autowired眯勾。還有一種較為復(fù)雜的聲明 Bean 的方式枣宫,這里先不展開(kāi)∑攀模現(xiàn)在問(wèn)題來(lái)了,我們知道在使用MyBatis時(shí)也颤,我們需要一個(gè) SqlSessionFactory 和一個(gè) SqlSession 才能完成一系列 select 操作洋幻。但是在 Spring Boot 中這些東西從哪來(lái)呢?既然我們?cè)谑褂?Spring翅娶,那么所有的依賴都需要 Spring 自動(dòng)幫我們完成文留,這個(gè)時(shí)候非常簡(jiǎn)單。我們只需要自動(dòng)注入一個(gè) SqlSession 就好了竭沫,Spring 會(huì)自動(dòng)幫你完成依賴的裝配和注入燥翅,然后就直接用它吧。

@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();
    }
}

頁(yè)面渲染

后端渲染

我們考慮使用模板引擎蜕提,模板引擎有 freemaker森书、jsp、velocity 贯溅。目前最流行的模板引擎是 Freemaker拄氯。與 MyBatis 相似,F(xiàn)reemaker 也有一個(gè) spring-boot-starter-freemaker 的依賴類庫(kù)它浅。我們需要在 resources/templates 目錄下創(chuàng)建 .ftlh 格式的模板文件,還需要排行榜的數(shù)據(jù)镣煮。我們稱這種響應(yīng) HTTP 的方式叫做 Model And View姐霍。有如下的寫法:

// html.ftlh
<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>排行榜</title>
</head>
<body>
    <table>
        <tr>
            <th>排名</th>
         <th>名字</th>
         <th>分?jǐn)?shù)</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);
    }
}

根據(jù) Freemaker 的語(yǔ)法,把所有數(shù)據(jù)填上去就可以了典唇。

<!DOCTYPE html>
<html lang="zh-CN">
<head>
    <title>排行榜</title>
</head>
<body>
    <table>
        <tr>
           <th>排名</th>
           <th>名字</th>
           <th>分?jǐn)?shù)</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 異步請(qǐng)求進(jìn)行前端渲染镊折。在 resources/static 下創(chuàng)建 index.html。Spring 規(guī)定在resource/static 目錄下的文件可以直接訪問(wèn)介衔。前端只需要用 ajax 訪問(wèn)某個(gè)接口獲取數(shù)據(jù)恨胚,前端使用 js 動(dòng)態(tài)的把數(shù)據(jù)加載到 html 上。

?著作權(quán)歸作者所有,轉(zhuǎn)載或內(nèi)容合作請(qǐng)聯(lián)系作者
  • 序言:七十年代末炎咖,一起剝皮案震驚了整個(gè)濱河市赃泡,隨后出現(xiàn)的幾起案子,更是在濱河造成了極大的恐慌乘盼,老刑警劉巖升熊,帶你破解...
    沈念sama閱讀 211,123評(píng)論 6 490
  • 序言:濱河連續(xù)發(fā)生了三起死亡事件,死亡現(xiàn)場(chǎng)離奇詭異绸栅,居然都是意外死亡级野,警方通過(guò)查閱死者的電腦和手機(jī),發(fā)現(xiàn)死者居然都...
    沈念sama閱讀 90,031評(píng)論 2 384
  • 文/潘曉璐 我一進(jìn)店門粹胯,熙熙樓的掌柜王于貴愁眉苦臉地迎上來(lái)蓖柔,“玉大人辰企,你說(shuō)我怎么就攤上這事】雒” “怎么了蟆豫?”我有些...
    開(kāi)封第一講書人閱讀 156,723評(píng)論 0 345
  • 文/不壞的土叔 我叫張陵,是天一觀的道長(zhǎng)懒闷。 經(jīng)常有香客問(wèn)我十减,道長(zhǎng),這世上最難降的妖魔是什么愤估? 我笑而不...
    開(kāi)封第一講書人閱讀 56,357評(píng)論 1 283
  • 正文 為了忘掉前任帮辟,我火速辦了婚禮,結(jié)果婚禮上玩焰,老公的妹妹穿的比我還像新娘由驹。我一直安慰自己,他們只是感情好昔园,可當(dāng)我...
    茶點(diǎn)故事閱讀 65,412評(píng)論 5 384
  • 文/花漫 我一把揭開(kāi)白布蔓榄。 她就那樣靜靜地躺著,像睡著了一般默刚。 火紅的嫁衣襯著肌膚如雪甥郑。 梳的紋絲不亂的頭發(fā)上,一...
    開(kāi)封第一講書人閱讀 49,760評(píng)論 1 289
  • 那天荤西,我揣著相機(jī)與錄音澜搅,去河邊找鬼。 笑死邪锌,一個(gè)胖子當(dāng)著我的面吹牛勉躺,可吹牛的內(nèi)容都是我干的。 我是一名探鬼主播觅丰,決...
    沈念sama閱讀 38,904評(píng)論 3 405
  • 文/蒼蘭香墨 我猛地睜開(kāi)眼饵溅,長(zhǎng)吁一口氣:“原來(lái)是場(chǎng)噩夢(mèng)啊……” “哼!你這毒婦竟也來(lái)了妇萄?” 一聲冷哼從身側(cè)響起蜕企,我...
    開(kāi)封第一講書人閱讀 37,672評(píng)論 0 266
  • 序言:老撾萬(wàn)榮一對(duì)情侶失蹤,失蹤者是張志新(化名)和其女友劉穎嚣伐,沒(méi)想到半個(gè)月后糖赔,有當(dāng)?shù)厝嗽跇淞掷锇l(fā)現(xiàn)了一具尸體,經(jīng)...
    沈念sama閱讀 44,118評(píng)論 1 303
  • 正文 獨(dú)居荒郊野嶺守林人離奇死亡轩端,尸身上長(zhǎng)有42處帶血的膿包…… 初始之章·張勛 以下內(nèi)容為張勛視角 年9月15日...
    茶點(diǎn)故事閱讀 36,456評(píng)論 2 325
  • 正文 我和宋清朗相戀三年放典,在試婚紗的時(shí)候發(fā)現(xiàn)自己被綠了。 大學(xué)時(shí)的朋友給我發(fā)了我未婚夫和他白月光在一起吃飯的照片。...
    茶點(diǎn)故事閱讀 38,599評(píng)論 1 340
  • 序言:一個(gè)原本活蹦亂跳的男人離奇死亡奋构,死狀恐怖壳影,靈堂內(nèi)的尸體忽然破棺而出,到底是詐尸還是另有隱情弥臼,我是刑警寧澤宴咧,帶...
    沈念sama閱讀 34,264評(píng)論 4 328
  • 正文 年R本政府宣布,位于F島的核電站径缅,受9級(jí)特大地震影響掺栅,放射性物質(zhì)發(fā)生泄漏。R本人自食惡果不足惜纳猪,卻給世界環(huán)境...
    茶點(diǎn)故事閱讀 39,857評(píng)論 3 312
  • 文/蒙蒙 一氧卧、第九天 我趴在偏房一處隱蔽的房頂上張望。 院中可真熱鬧氏堤,春花似錦沙绝、人聲如沸。這莊子的主人今日做“春日...
    開(kāi)封第一講書人閱讀 30,731評(píng)論 0 21
  • 文/蒼蘭香墨 我抬頭看了看天上的太陽(yáng)。三九已至购笆,卻和暖如春粗悯,著一層夾襖步出監(jiān)牢的瞬間,已是汗流浹背由桌。 一陣腳步聲響...
    開(kāi)封第一講書人閱讀 31,956評(píng)論 1 264
  • 我被黑心中介騙來(lái)泰國(guó)打工为黎, 沒(méi)想到剛下飛機(jī)就差點(diǎn)兒被人妖公主榨干…… 1. 我叫王不留,地道東北人行您。 一個(gè)月前我還...
    沈念sama閱讀 46,286評(píng)論 2 360
  • 正文 我出身青樓,卻偏偏與公主長(zhǎng)得像剪廉,于是被迫代替她去往敵國(guó)和親娃循。 傳聞我的和親對(duì)象是個(gè)殘疾皇子,可洞房花燭夜當(dāng)晚...
    茶點(diǎn)故事閱讀 43,465評(píng)論 2 348

推薦閱讀更多精彩內(nèi)容