1000字范文 > JAVA WEB快速入门之从编写一个基于SpringBoot+Mybatis快速创建的REST API项目了解Sp

JAVA WEB快速入门之从编写一个基于SpringBoot+Mybatis快速创建的REST API项目了解Sp

时间：2021-03-11 07:11:40

JAVA WEB快速入门系列之前的相关文章如下：（文章全部本人【梦在旅途原创】，文中内容可能部份图片、代码参照网上资源）

第一篇：JAVA WEB快速入门之环境搭建

第二篇：JAVA WEB快速入门之从编写一个JSP WEB网站了解JSP WEB网站的基本结构、调试、部署

第三篇：JAVA WEB快速入门之通过一个简单的Spring项目了解Spring的核心（AOP、IOC）

第四篇：JAVA WEB快速入门之从编写一个基于SpringMVC框架的网站了解Maven、SpringMVC、SpringJDBC

今天是第五篇，也是该系列文章的最后一篇，接上篇《JAVA WEB快速入门之从编写一个基于SpringMVC框架的网站了解Maven、SpringMVC、SpringJDBC》，通过上篇文章的详细介绍，知道如何使用maven来快速构建spring MVC应用，也能够使用spring MVC+springJDBC实现网站开发，而本文所涉及的知识则是在这基础之上继续提升，核心是讲解如何使用spring boot来更快速的构建spring MVC，并通过mybatis及代码生成相关DAO，同时利用VUE前端框架开发前后端分离的网站，用户体验更好，废话不多说，直接进入本文主题。

(提示：本文内容有点长，涉及的知识点也比较多，若是新手建议耐心看完！)

一、创建Spring Boot+SpringMVC空项目

1.1通过https://start.spring.io/官网快速生成一个Spring Boot+SpringMVC空项目，如下图示：

（当然也可以通过Eclipse或IDEA的Spring Boot插件来创建，可参见：/shaoniandream/p/9679942.html，/qq_32572497/article/details/62037873）

设置后点击页面的生成项目按钮，即可生成并下载spring boot项目代码压缩包，然后使用IDE导入存在的maven project即可。

1.2调整项目，解决一些踩坑点

1.2.1.调整spring boot App启动类（如：SpringbootdemoApplication）到根包目录或在启动类上显式添加@ComponentScan注解，并指定包路径，如下代码所示，cn.zuowenjun.boot是根包目录，其余都是cn.zuowenjun.boot的子包

package cn.zuowenjun.boot;import org.mybatis.spring.annotation.MapperScan;import org.springframework.boot.SpringApplication;import org.springframework.boot.autoconfigure.SpringBootApplication;import org.springframework.transaction.annotation.EnableTransactionManagement;//import org.springframework.ponentScan;@SpringBootApplication //指定为Spring Boot启动入口，内含多个spring所需要的注解@MapperScan(basePackages="cn.zuowenjun.boot.mapper")//设置Mybaits扫描的mapper包路径//@ComponentScan(basePackages= {"cn.zuowenjun.controller"}) //如果不在根包目录，则需指定spring管理的相关包路径@EnableTransactionManagement //启动事务管理public class SpringbootdemoApplication {public static void main(String[] args) {SpringApplication.run(SpringbootdemoApplication.class, args);}}

1.2.2.解决POM文件报：

Description Resource Path Location Type

Execution default-resources of goal org.apache.maven.plugins:maven-resources-plugin:3.1.0:resources failed: Unable to load the mojo 'resources' (or one of its required components) from the plugin 'org.apache.maven.plugins:maven-resources-plugin:3.1.0'

直接在POM中添加如下resources依赖：

<dependency><groupId>org.apache.maven.plugins</groupId><artifactId>maven-resources-plugin</artifactId><version>2.5</version><type>maven-plugin</type></dependency>

1.2.3.设置热编译启动模式，以便可以随时更改代码后即时生效

<dependencies><dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId><optional>true</optional></dependency></dependencies><build><plugins><plugin><groupId>org.springframework.boot</groupId><artifactId>spring-boot-maven-plugin</artifactId><configuration><fork>true</fork></configuration></plugin></plugins></build>

设置后项目的视图就有如下显示效果：

1.3演示请求REST API分别返回JSON、XML

创建好spring boot空项目环境后，我们就可以开始编写相关代码了，在此仅贴出实现了REST API分别响应返回JSON、XML格式的Controller，实现步骤如下：

1.3.1在cn.zuowenjun.boot.controller包中创建DemoController，并编写hellojson、helloxml Action方法，代码如下：

package cn.zuowenjun.boot.controller;import org.springframework.web.bind.annotation.*;import cn.zuowenjun.boot.domain.*;@RestControllerpublic class DemoController {@RequestMapping(value="/hello/json",produces="application/json;charset=utf-8")public HelloDto hellojson(){HelloDto dto=new HelloDto();dto.setMessage("hello,,hello java spring boot!");return dto;}@RequestMapping(value="/hello/xml",produces="text/xml;charset=utf-8")public HelloDto helloxml(){HelloDto dto=new HelloDto();dto.setMessage("hello,,hello java spring boot!");return dto;}}

如上代码简要说明：@RestController相当于是：@Controller、@ResponseBody，这个可以查看@RestController注解类代码就知道；@RequestMapping指定请求映射，其中produces设置响应内容格式（可理解为服务端是生产者，而用户在浏览器端【客户端】是消费端），还有consumes属性，这个是指可接收请求的内容格式（可理解为用户在浏览器端发送请求是消息的生产者，而服务端接收并处理该请求为消息的消费者），当然还有其它一些属性，大家可以参见我上篇文章或网络其它大神的相关文章加以了解。

另外需要注意，默认spring MVC只返回JSON格式，若需返回XML格式，还需添加XML JAR包依赖，如下：（可以看到version这里我指定了版本号区间，表示2.5.0及以上版本都可以，有些依赖spring-boot-starter-parent中都有提前配置依赖管理，我们只需要指定groupId、artifactId即可，version就会使用spring boot中的默认版本，当然也可以强制指定版本）

<dependency><groupId>com.fasterxml.jackson.jaxrs</groupId><artifactId>jackson-jaxrs-xml-provider</artifactId><version>[2.5.0,)</version></dependency>

由于项目中同时添加JSON及XML的JAR包，按照spring MVC的默认响应处理流程是：如果未指定produces，则当请求的header中指定了accept类型，则自动格式化并返回该accept所需的类型，如果未指定accept类型，则优先是响应XML，当找不到XML依赖包时才会响应JSON，故如果项目中同时有JSON及XML，那么最好显式指定produces或者请求头上指明accept类型这一点与 WEB API原理相同，因为都是符合REST架构风格的。

效果如下：

二、使用Mybatis框架完成Domain层、DAO层(这里是Mapper层)---提示：由于篇幅有限，只贴出重点能体现不同知识点的代码，其余可以到GITHUB上查看下载源码进行详细了解

2.0：首先在application.properties配置mybatis的相关选项，如下所示：

mybatis.type-aliases-package=cn.zuowenjun.boot.domain #包类型别名，这样在XML中就可以简写成类名mybatis.config-location=classpath:mybatis/mybatis-config.xml #指定mybatis的配置文件路径mybatis.mapper-locations=classpath:mybatis/mapper/*.xml #指定mapper XML的存放路径#这里是使用SQL SERVER，如果是其它DB则使用其它驱动spring.datasource.driverClassName=com.microsoft.sqlserver.jdbc.SQLServerDriverspring.datasource.url=jdbc:sqlserver://DBIP:Port;DatabaseName=testDBspring.datasource.username=dbuserspring.datasource.password=dbpassword

其次添加mybatis-spring-boot-starter maven依赖,它会自动添加相关的mybatis依赖包，配置如下：

<dependency><groupId>org.mybatis.spring.boot</groupId><artifactId>mybatis-spring-boot-starter</artifactId><version>1.3.2</version></dependency>

2.1全手写JAVA代码实现Mybatis的CRUD；

2.1.1.在cn.zuowenjun.boot.domain包【实体模型或称领域模型层，这里算不上真正的领域模型，最多算是贫血的领域模型】中定义数据实体模型（Goods:商品信息），代码如下：

package cn.zuowenjun.boot.domain;import java.math.BigDecimal;import java.util.Date;public class Goods {private int id;private String title;private String picture;private BigDecimal price;private String introduction;private int categoryId;private String lastEditBy;private Date lastEditTime;public Goods() {}public Goods(int id,String title,String picture,BigDecimal price,String introduction,int categoryId,String lastEditBy,Date lastEditTime) {this.setId(id);this.setTitle(title);this.setPicture(picture);this.setPrice(price);this.setIntroduction(introduction);this.setCategoryId(categoryId);this.setLastEditBy(lastEditBy);this.setLastEditTime(lastEditTime);}public int getId() {return id;}public void setId(int id) {this.id = id;}public String getTitle() {return title;}public void setTitle(String title) {this.title = title;}public String getPicture() {return picture;}public void setPicture(String picture) {this.picture = picture;}public BigDecimal getPrice() {return price;}public void setPrice(BigDecimal price) {this.price = price;}public String getIntroduction() {return introduction;}public void setIntroduction(String introduction) {this.introduction = introduction;}public int getCategoryId() {return categoryId;}public void setCategoryId(int categoryId) {this.categoryId = categoryId;}public String getLastEditBy() {return lastEditBy;}public void setLastEditBy(String lastEditBy) {this.lastEditBy = lastEditBy;}public Date getLastEditTime() {return lastEditTime;}public void setLastEditTime(Date lastEditTime) {this.lastEditTime = lastEditTime;}}

View Code

2.1.2.在cn.zuowenjun.boot.mapper包【数据映射处理层或称DAO层】中定义数据映射处理接口及添加相应的SQL注解，以实现对数据进行CRUD，代码如下：

package cn.zuowenjun.boot.mapper;import java.util.*;import org.apache.ibatis.annotations.*;import cn.zuowenjun.boot.domain.*;public interface GoodsMapper {@Select("select * from TA_TestGoods order by id offset (${pageNo}-1)*${pageSize} rows fetch next ${pageSize} rows only")List<Goods> getListByPage(int pageSize,int pageNo);@Select("select * from TA_TestGoods where categoryId=#{categoryId} order by id")List<Goods> getList(int categoryId);@Select("<script>select * from TA_TestGoods where id in " +"<foreach item='item' index='index' collection='ids' open='(' separator=',' close=')'>#{item}</foreach>"+"order by id</script>")List<Goods> getListByMultIds(@Param("ids")int...ids);@Select("select * from TA_TestGoods where id=#{id}")Goods get(int id);@Insert(value="insert into TA_TestGoods(title, picture, price, introduction, categoryId, "+ "lastEditBy, lastEditTime) values(#{title},#{picture},#{price},#{introduction},#{categoryId},#{lastEditBy},getdate())")@Options(useGeneratedKeys=true,keyProperty="id",keyColumn="id")void insert(Goods goods);@Delete(value="delete from TA_TestGoods where id=#{id}")void delete(int id);@Update("update TA_TestGoods set title=#{title},picture=#{picture},price=#{price},introduction=#{introduction}," + "categoryId=#{categoryId},lastEditBy=#{lastEditBy},lastEditTime=getdate() " + "where id=#{id}")void update(Goods goods);}

如上代码重点说明：

a.增删改查，对应的注解是：insert、delete、update、select；

b.SQL注解中的参数占位符有两种，一种是：#{xxx}，最后会生成?的参数化执行，另一种是：${xxx}则最后会直接替换成参数的值，即拼SQL（除非信任参数或一些时间、数字类型，否则不建议这种，存在SQL注入风险）；

c.insert时如果有自增ID，则可以通过添加Options注解，并指定useGeneratedKeys=true,keyProperty="数据实体类的属性字段名",keyColumn="表自增ID的字段名"，这样当insert成功后会自动回填到数据实体类的自增ID对应的属性上；

d.如果想要生成in子句查询，则如上代码getListByMultIds方法上的select注解中使用<script>xxx<foreach>xx</foreach>xx</script>格式实现，如果想用实现复杂的一对一，一对多，多对多等复杂的查询，则需要添加results注解并指定相应的关联关系，同时select SQL语句也应关联查询，可参见：/desert568/article/details/79079151

以上2步即完成一个mapper操作类；

2.2全手写AVA代码+Mapper XML实现Mybatis的CRUD；

2.2.1.仍然是在cn.zuowenjun.boot.domain包中定义一个数据实体模型类（ShoppingCart：购物车信息），代码如下：【注意这里有一个关联商品信息的属性：inGoods】

package cn.zuowenjun.boot.domain;import java.util.Date;public class ShoppingCart {private int id;private String shopper;private int goodsId;private int qty;private Date addedTime;private Goods inGoods;public ShoppingCart() {}public ShoppingCart(int id,String shopper,int goodsId,int qty,Date addedTime) {this.id=id;this.shopper=shopper;this.goodsId=goodsId;this.qty=qty;this.addedTime=addedTime;}public int getId() {return id;}public void setId(int id) {this.id = id;}public String getShopper() {return shopper;}public void setShopper(String shopper) {this.shopper = shopper;}public int getGoodsId() {return goodsId;}public void setGoodsId(int goodsId) {this.goodsId = goodsId;}public int getQty() {return qty;}public void setQty(int qty) {this.qty = qty;}public Date getAddedTime() {return addedTime;}public void setAddedTime(Date addedTime) {this.addedTime = addedTime;}public Goods getInGoods() {return inGoods;}public void setInGoods(Goods inGoods) {this.inGoods = inGoods;}}

View Code

2.2.2.仍然是在cn.zuowenjun.boot.mapper包中定义数据操作接口（interface），注意这里只是定义接口，并不包含SQL注解部份，因为这部份将在Mapper的XML代码中进行配置实现，代码如下：

package cn.zuowenjun.boot.mapper;import java.util.List;import org.apache.ibatis.annotations.Param;import cn.zuowenjun.boot.domain.*;public interface ShoppingCartMapper {List<ShoppingCart> getList(String shopper);void insert(ShoppingCart shoppingCart);void update(ShoppingCart shoppingCart);void deleteItem(int id);void delete(String shopper);int getBuyCount(String shopper);ShoppingCart get(@Param("shopper") String shopper,@Param("goodsId") int goodsId); }

如上代码有一个重点说明：get方法有两个参数（多个参数也类似），为了mybatis能够自动映射到这些参数，必需为每个参数添加Param注解，并指定参数名，这个参数名是与对应的Mapper XML中的SQL语句中定义的参数名相同。

2.2.3.在mybatis.mapper-locations设置的mapper xml存放的路径中创建XML文件，并手动编写映射的SQL语句，如下所示：

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE mapper PUBLIC "-////DTD Mapper 3.0//EN" "/dtd/mybatis-3-mapper.dtd" ><mapper namespace="cn.zuowenjun.boot.mapper.ShoppingCartMapper"><resultMap id="shoppingCartMap" type="ShoppingCart" ><id column="id" property="id" jdbcType="INTEGER" /><result column="shopper" property="shopper" jdbcType="NVARCHAR" /><result column="goodsId" property="goodsId" jdbcType="INTEGER" /><result column="qty" property="qty" jdbcType="INTEGER"/><result column="addedTime" property="addedTime" jdbcType="DATE" /><association property="inGoods" javaType="cn.zuowenjun.boot.domain.Goods"><id column="id" property="id" jdbcType="INTEGER" /><result column="title" property="title" /><result column="picture" property="picture" /><result column="price" property="price" /><result column="introduction" property="introduction" /><result column="categoryId" property="categoryId" /><result column="lastEditBy" property="lastEditBy" /><result column="lastEditTime" property="lastEditTime" /></association></resultMap><select id="getList" parameterType="string" resultMap="shoppingCartMap">select * from TA_TestShoppingCart a inner join TA_TestGoods b on a.goodsId=b.id where shopper=#{shopper} order by addedTime</select><select id="getBuyCount" parameterType="string" resultType="int">select count(1) from (select goodsId from TA_TestShoppingCart where shopper=#{shopper} group by goodsId) as t</select><select id="get" resultMap="shoppingCartMap">select * from TA_TestShoppingCart a inner join TA_TestGoods b on a.goodsId=b.id where shopper=#{shopper} and goodsId=#{goodsId}</select><insert id="insert" parameterType="ShoppingCart" useGeneratedKeys="true" keyProperty="id" keyColumn="id">insert into TA_TestShoppingCart(shopper, goodsId, qty, addedTime) values(#{shopper},#{goodsId},#{qty},getdate())</insert><update id="update" parameterType="ShoppingCart" >update TA_TestShoppingCart set shopper=#{shopper},goodsId=#{goodsId},qty=#{qty},addedTime=getdate() where id=#{id}</update><delete id="deleteItem" parameterType="int">delete from TA_TestShoppingCart where id=#{id}</delete><delete id="delete" parameterType="string">delete from TA_TestShoppingCart where shopper=#{shopper}</delete></mapper>

如上XML重点说明：

a.凡是使用到类型的地方，可以在mybatis-config.xml中提前配置类型别名，以简化配置，当然mybatis已默认设置了一些别名以减少大家配置的工作量，如：string，对应的类型是String等，详见：/mybatis-3/zh/configuration.html#typeAliases

b.由于这个ShoppingCart有关联属性：inGoods，故在查询时都会关联查询goods表并通过在resultMap中通过association元素来指定关联关系，更多复杂的XML配置详见：/mybatis-3/zh/sqlmap-xml.html

以上3步即完成一个mapper操作类，相比直接使用mapper接口+SQL注解多了一个步骤，但这样的好处是由于没有写死在代码中，可以很容易的更改mapper的相关SQL语句，减少代码改动量。

2.3使用Mybatis Generator的Maven插件自动生成Mybatis的CRUD；

通过上面的介绍，我们知道有2种方法来实现一个mapper数据操作类（dao），显然第2种更能适应更改的情况，但由于手写mapper xml文件非常的麻烦，故可以通过Mybatis Generator组件，自动生成相关的代码及xml（一般是：数据实体类domain、数据处理接口mapper、mapper XML），具体实现步骤如下：(可以单独一个项目来生成这些文件，也可以集成在一个项目中，由于是演示，我这里是集成在一个项目中)

2.3.1.由于要使用Mybatis Generator组件，故需要添加对应的JAR包依赖，如下所示：

<dependency><groupId>com.microsoft.sqlserver</groupId><artifactId>mssql-jdbc</artifactId><version>7.0.0.jre8</version></dependency><dependency><groupId>org.mybatis.generator</groupId><artifactId>mybatis-generator-core</artifactId><version>1.3.7</version></dependency>

同时需要添加对应的maven插件，以便通过maven命令可执行生成过程，如下：（通过configurationFile元素指定生成器的配置路径，overwrite元素指定是否覆盖生成，这里有个坑，后面会介绍到，此处略）

<build><plugins> <plugin><groupId>org.mybatis.generator</groupId><artifactId>mybatis-generator-maven-plugin</artifactId><version>1.3.7</version><configuration><configurationFile>src/main/resources/mybatis/generatorconfig.xml</configurationFile><verbose>true</verbose><overwrite>true</overwrite></configuration></plugin></plugins></build>

2.3.2.在cn.zuowenjun.boot.domain包中定义相关的数据实体模型类，我这里演示的类是：ShoppingOrder（购物订单信息），代码如下：

package cn.zuowenjun.boot.domain;import java.math.BigDecimal;import java.util.Date;public class ShoppingOrder {private Integer id;private String shopper;private Integer totalqty;private BigDecimal totalprice;private Boolean iscompleted;private String createby;private Date createtime;public Integer getId() {return id;}public void setId(Integer id) {this.id = id;}public String getShopper() {return shopper;}public void setShopper(String shopper) {this.shopper = shopper == null ? null : shopper.trim();}public Integer getTotalqty() {return totalqty;}public void setTotalqty(Integer totalqty) {this.totalqty = totalqty;}public BigDecimal getTotalprice() {return totalprice;}public void setTotalprice(BigDecimal totalprice) {this.totalprice = totalprice;}public Boolean getIscompleted() {return iscompleted;}public void setIscompleted(Boolean iscompleted) {this.iscompleted = iscompleted;}public String getCreateby() {return createby;}public void setCreateby(String createby) {this.createby = createby == null ? null : createby.trim();}public Date getCreatetime() {return createtime;}public void setCreatetime(Date createtime) {this.createtime = createtime;}}

View Code

2.3.3.配置generatorconfig.xml，指定生成的各个细节，由于generatorconfig的配置节点比较多,如下只是贴出当前示例的配置信息，有一点要说明，注意配置节点的顺序，如果顺序不对就会报错，完整的配置方法详情介绍可参见：/free/Mybatis_Utils/blob/master/MybatisGeneator/MybatisGeneator.md或/handsomeye/p/6268513.html

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE generatorConfigurationPUBLIC "-////DTD MyBatis Generator Configuration 1.0//EN""/dtd/mybatis-generator-config_1_0.dtd"><generatorConfiguration><properties resource="application.properties" /><classPathEntrylocation="E:/LocalMvnRepositories/com/microsoft/sqlserver/mssql-jdbc/7.0.0.jre8/mssql-jdbc-7.0.0.jre8.jar" /><context id="my" targetRuntime="MyBatis3Simple" defaultModelType="flat"><property name="javaFileEncoding" value="UTF-8" /><commentGenerator><property name="suppressAllComments" value="true" /><property name="suppressDate" value="true" /></commentGenerator><jdbcConnectiondriverClass="${spring.datasource.driverClassName}"connectionURL="${spring.datasource.url}"userId="${spring.datasource.username}"password="${spring.datasource.password}"></jdbcConnection><javaModelGeneratortargetPackage="cn.zuowenjun.boot.domain"targetProject="src/main/java"><property name="enableSubPackages" value="false" /><property name="trimStrings" value="true" /></javaModelGenerator><sqlMapGenerator targetPackage="mybatis.mapper"targetProject="src/main/resources"><property name="enableSubPackages" value="false" /></sqlMapGenerator><javaClientGeneratortargetPackage="cn.zuowenjun.boot.mapper"targetProject="src/main/java" type="XMLMAPPER"><property name="enableSubPackages" value="false" /></javaClientGenerator><table tableName="TA_TestShoppingOrder"domainObjectName="ShoppingOrder"><generatedKey column="id" sqlStatement="JDBC" identity="true" /></table></context></generatorConfiguration>

View Code

由于涉及的知识点比较多，在此就不作介绍，请参见我给出的链接加以了解。

2.3.4.通过maven插件来执行生成代码（生成代码有很多种方法，详见：/qq_32786873/article/details/78226925），这里我使用最为方便的一种，步骤如下：

项目右键-》RunAs或者DeBug-》Maven Build...-》在goals（阶段）中输入：mybatis-generator:generate，即：设置生成阶段，最后点击Apply或直接Run即可，如图示：

执行生成后，会在控制台中显示最终的结果，如下图示：如果成功会显示buid success，并会在相应的目录中生成对应的文件

2.4进阶用法：自定义Mybatis Generator的生成过程中的插件类，以便添加额外自定义的方法

虽然使用Mybatis Generator减少了手工编写代码及XML的工作量，但由于生成的CRUD方法都是比较简单的，稍微复杂或灵活一点的方法都不能简单生成，如果单纯的在生成代码后再人工手动添加其它自定义的方法，又担心如果执行一次自动生成又会覆盖手动添加的自定义代码，那有没有办法解决呢？当然是有的，我（梦在旅途,）在网络上了解到的方法大部份都是说获取Mybatis Generator源代码，然后进行二次开发，最后使用“定制版”的Mybatis Generator，我个人觉得虽然能解决问题，但如果能力不足，可能会出现意想不到的问题，而且进行定制也不是那么简单的，故我这里采取Mybatis Generator框架提供的可扩展插件plugin来实现扩展，具体步骤如下：

2.4.1.在项目新创建一个包cn.zuowenjun.boot.mybatis.plugin,然后在包里面先创建一个泛型通用插件基类（CustomAppendMethodPlugin），这个基类主要是用于附加自定义方法，故取名CustomAppendMethodPlugin，代码如下：

package cn.zuowenjun.boot.mybatis.plugin;import java.util.List;import org.mybatis.generator.api.IntrospectedTable;import org.mybatis.generator.api.PluginAdapter;import org.mybatis.generator.api.dom.java.Interface;import org.mybatis.generator.api.dom.java.TopLevelClass;import org.mybatis.generator.api.dom.xml.Document;import org.mybatis.generator.codegen.mybatis3.javamapper.elements.AbstractJavaMapperMethodGenerator;import org.mybatis.generator.codegen.mybatis3.xmlmapper.elements.AbstractXmlElementGenerator;/** 自定义通用可添加生成自定义方法插件类* Author:zuowenjun* Date:-1-29*/public abstract class CustomAppendMethodPlugin<TE extends AbstractXmlElementGenerator,TM extends AbstractJavaMapperMethodGenerator> extends PluginAdapter {protected final Class<TE> teClass;protected final Class<TM> tmClass;@SuppressWarnings("unchecked")public CustomAppendMethodPlugin(Class<? extends AbstractXmlElementGenerator> teClass,Class<? extends AbstractJavaMapperMethodGenerator> tmClass) {this.teClass=(Class<TE>) teClass;this.tmClass=(Class<TM>) tmClass;}@Overridepublic boolean sqlMapDocumentGenerated(Document document,IntrospectedTable introspectedTable) {try {AbstractXmlElementGenerator elementGenerator = teClass.newInstance();elementGenerator.setContext(context);elementGenerator.setIntrospectedTable(introspectedTable);elementGenerator.addElements(document.getRootElement());} catch (InstantiationException | IllegalAccessException e) {// TODO Auto-generated catch blocke.printStackTrace();}return super.sqlMapDocumentGenerated(document, introspectedTable);}@Overridepublic boolean clientGenerated(Interface interfaze,TopLevelClass topLevelClass,IntrospectedTable introspectedTable) {try {AbstractJavaMapperMethodGenerator methodGenerator = tmClass.newInstance();methodGenerator.setContext(context);methodGenerator.setIntrospectedTable(introspectedTable);methodGenerator.addInterfaceElements(interfaze);} catch (InstantiationException | IllegalAccessException e) {// TODO Auto-generated catch block e.printStackTrace();}return super.clientGenerated(interfaze, topLevelClass, introspectedTable);}@Overridepublic boolean validate(List<String> warnings) {// TODO Auto-generated method stubreturn true;}}

View Code

代码比较简单，主要是重写了sqlMapDocumentGenerated（生成mapper xml方法）、clientGenerated（生成mapper接口方法），在这里面我通过把指定泛型类型（分别继承自 AbstractXmlElementGenerator、AbstractJavaMapperMethodGenerator）加入到生成XML和接口的过程中，以实现生成过程的抽象。

2.4.2.我这里由于默认生成的ShoppingOrderDetailMapper（实体类：ShoppingOrderDetail是购物订单详情）无法满足需要，我需要额外再增加两个方法：

List<ShoppingOrderDetail> selectByOrderId(int shoppingOrderId); 、void deleteByOrderId(int shoppingOrderId);故在这里自定义继承自CustomAppendMethodPlugin的插件类：ShoppingOrderDetailMapperPlugin，具体实现代码如下：

package cn.zuowenjun.boot.mybatis.plugin;import java.util.Set;import java.util.TreeSet;import org.mybatis.generator.api.dom.java.FullyQualifiedJavaType;import org.mybatis.generator.api.dom.java.Interface;import org.mybatis.generator.api.dom.java.JavaVisibility;import org.mybatis.generator.api.dom.java.Method;import org.mybatis.generator.api.dom.java.Parameter;import org.mybatis.generator.api.dom.xml.Attribute;import org.mybatis.generator.api.dom.xml.TextElement;import org.mybatis.generator.api.dom.xml.XmlElement;import org.mybatis.generator.codegen.mybatis3.javamapper.elements.AbstractJavaMapperMethodGenerator;import org.mybatis.generator.codegen.mybatis3.xmlmapper.elements.AbstractXmlElementGenerator;/** ref see /se7end/p/9293755.html* Author:zuowenjun* Date:-1-29*/public class ShoppingOrderDetailMapperPlugin extends CustomAppendMethodPlugin<ShoppingOrderDetailXmlElementGenerator, AbstractJavaMapperMethodGenerator> {public ShoppingOrderDetailMapperPlugin() {super(ShoppingOrderDetailXmlElementGenerator.class,ShoppingOrderDetailJavaMapperMethodGenerator.class);}}class ShoppingOrderDetailXmlElementGenerator extends AbstractXmlElementGenerator{@Overridepublic void addElements(XmlElement parentElement) {if(!introspectedTable.getAliasedFullyQualifiedTableNameAtRuntime().equalsIgnoreCase("TA_TestShoppingOrderDetail")) {return;}TextElement selectText = new TextElement("select * from " + introspectedTable.getAliasedFullyQualifiedTableNameAtRuntime()+ " where shoppingOrderId=#{shoppingOrderId}");XmlElement selectByOrderId = new XmlElement("select");selectByOrderId.addAttribute(new Attribute("id", "selectByOrderId"));selectByOrderId.addAttribute(new Attribute("resultMap", "BaseResultMap"));selectByOrderId.addAttribute(new Attribute("parameterType", "int"));selectByOrderId.addElement(selectText);parentElement.addElement(selectByOrderId);TextElement deleteText = new TextElement("delete from " + introspectedTable.getAliasedFullyQualifiedTableNameAtRuntime()+ " where shoppingOrderId=#{shoppingOrderId}");XmlElement deleteByOrderId = new XmlElement("delete");deleteByOrderId.addAttribute(new Attribute("id", "deleteByOrderId"));deleteByOrderId.addAttribute(new Attribute("parameterType", "int"));deleteByOrderId.addElement(deleteText);parentElement.addElement(deleteByOrderId);}}class ShoppingOrderDetailJavaMapperMethodGenerator extends AbstractJavaMapperMethodGenerator{@Overridepublic void addInterfaceElements(Interface interfaze) {if(!introspectedTable.getAliasedFullyQualifiedTableNameAtRuntime().equalsIgnoreCase("TA_TestShoppingOrderDetail")) {return;}addInterfaceSelectByOrderId(interfaze);addInterfaceDeleteByOrderId(interfaze);}private void addInterfaceSelectByOrderId(Interface interfaze) {// 先创建import对象Set<FullyQualifiedJavaType> importedTypes = new TreeSet<FullyQualifiedJavaType>();// 添加Lsit的包 importedTypes.add(FullyQualifiedJavaType.getNewListInstance());// 创建方法对象Method method = new Method();// 设置该方法为public method.setVisibility(JavaVisibility.PUBLIC);// 设置返回类型是ListFullyQualifiedJavaType returnType = FullyQualifiedJavaType.getNewListInstance();FullyQualifiedJavaType listArgType = new FullyQualifiedJavaType(introspectedTable.getBaseRecordType());returnType.addTypeArgument(listArgType);// 方法对象设置返回类型对象 method.setReturnType(returnType);// 设置方法名称为我们在IntrospectedTable类中初始化的 “selectByOrderId”method.setName("selectByOrderId");// 设置参数类型是int类型 FullyQualifiedJavaType parameterType;parameterType = FullyQualifiedJavaType.getIntInstance();// import参数类型对象(基本类型其实可以不必引入包名)//importedTypes.add(parameterType);// 为方法添加参数，变量名称recordmethod.addParameter(new Parameter(parameterType, "shoppingOrderId")); //$NON-NLS-1$// context.getCommentGenerator().addGeneralMethodComment(method, introspectedTable);if (context.getPlugins().clientSelectByPrimaryKeyMethodGenerated(method, interfaze, introspectedTable)) {interfaze.addImportedTypes(importedTypes);interfaze.addMethod(method);}}private void addInterfaceDeleteByOrderId(Interface interfaze) {// 创建方法对象Method method = new Method();// 设置该方法为public method.setVisibility(JavaVisibility.PUBLIC);// 设置方法名称为我们在IntrospectedTable类中初始化的 “deleteByOrderId”method.setName("deleteByOrderId");// 设置参数类型是int类型 FullyQualifiedJavaType parameterType;parameterType = FullyQualifiedJavaType.getIntInstance();method.addParameter(new Parameter(parameterType, "shoppingOrderId")); //$NON-NLS-1$ context.getCommentGenerator().addGeneralMethodComment(method, introspectedTable);if (context.getPlugins().clientSelectByPrimaryKeyMethodGenerated(method, interfaze, introspectedTable)) {interfaze.addMethod(method);}}}

从如上代码所示，核心点是自定义继承自AbstractXmlElementGenerator、AbstractJavaMapperMethodGenerator的ShoppingOrderDetailXmlElementGenerator（XML生成器类）、ShoppingOrderDetailJavaMapperMethodGenerator（mapper接口生成器类），然后分别在addElements、addInterfaceElements添加自定义生成XML及接口方法的逻辑（如上代码中使用的是反射，若想学习了解反射请自行网上查找相关资料，C#也有反射哦，应该好理解），注意由于插件在生成过程中每个实体类都会调用一次，故必需作相应的判断（判断当前要附加的自定义方法是符与当前实体类生成过程相符，如果不相符则忽略退出）

如下是ShoppingOrderDetail实体类的代码：

package cn.zuowenjun.boot.domain;import java.math.BigDecimal;import java.util.Date;public class ShoppingOrderDetail {private Integer id;private Integer shoppingorderid;private Integer goodsid;private Integer qty;private BigDecimal totalprice;private String createby;private Date createtime;public Integer getId() {return id;}public void setId(Integer id) {this.id = id;}public Integer getShoppingorderid() {return shoppingorderid;}public void setShoppingorderid(Integer shoppingorderid) {this.shoppingorderid = shoppingorderid;}public Integer getGoodsid() {return goodsid;}public void setGoodsid(Integer goodsid) {this.goodsid = goodsid;}public Integer getQty() {return qty;}public void setQty(Integer qty) {this.qty = qty;}public BigDecimal getTotalprice() {return totalprice;}public void setTotalprice(BigDecimal totalprice) {this.totalprice = totalprice;}public String getCreateby() {return createby;}public void setCreateby(String createby) {this.createby = createby == null ? null : createby.trim();}public Date getCreatetime() {return createtime;}public void setCreatetime(Date createtime) {this.createtime = createtime;}}

View Code

另外顺便解决一个踩坑点：上面提到了，我们在POM文件配置mybatis-generator-maven-plugin插件时，overwrite设为true，目的是确保每次执行生成时，生成的代码能够覆盖已经存在的，理想是美好的，但现实总会有点小意外，我们这样配置，只能解决生成的mapper接口类文件不会重复，但生成的mapper xml文件仍然会附加代码导致重复，故我们需要解决这个问题，而解决这个问题的关键是：GeneratedXmlFile.isMergeable，如果isMergeable为true则会合并，目前默认都是false，所以我们只需实现将GeneratedXmlFile.isMergeable设为true即可，由于isMergeable是私有字段，只能采取插件+反射动态改变这个值了，自定义合并代码插件OverIsMergeablePlugin实现如下：

package cn.zuowenjun.boot.mybatis.plugin;import java.lang.reflect.Field;import java.util.List;import org.mybatis.generator.api.GeneratedXmlFile;import org.mybatis.generator.api.IntrospectedTable;import org.mybatis.generator.api.PluginAdapter;/** 修复mybatis-generator重复执行时生成的XML有重复代码(核心：isMergeable=false)* Author:/zengqiang1/article/details/79381418* Editor:zuowenjun*/public class OverIsMergeablePlugin extends PluginAdapter {@Overridepublic boolean validate(List<String> warnings) {return true;}@Overridepublic boolean sqlMapGenerated(GeneratedXmlFile sqlMap,IntrospectedTable introspectedTable) {try {Field field = sqlMap.getClass().getDeclaredField("isMergeable");field.setAccessible(true);field.setBoolean(sqlMap, false);} catch (Exception e) {e.printStackTrace();}return true;}}

2.4.3.在generatorconfig.xml配置文件中增加plugin配置，如下：

<plugin type="cn.zuowenjun.boot.mybatis.plugin.OverIsMergeablePlugin"></plugin><plugin type="cn.zuowenjun.boot.mybatis.plugin.ShoppingOrderDetailMapperPlugin"></plugin>... ...省略中间过程<table tableName="TA_TestShoppingOrderDetail"domainObjectName="ShoppingOrderDetail"><generatedKey column="id" sqlStatement="JDBC" identity="true" /></table>

2.4.4.由于不能在同一个项目中直接使用plugin类（具体原因请上网查询，在此了解即可），故还需把cn.zuowenjun.boot.mybatis.plugin这个包中的文件单独导出生成JAR包，然后把这个JAR包复制到项目的指定目录下（本示例是放在libs目录下），然后再在POM为mybatis-generator-maven-plugin单独添加system本地依赖才行，maven添加依赖如下：

<plugin><groupId>org.mybatis.generator</groupId><artifactId>mybatis-generator-maven-plugin</artifactId><version>1.3.7</version><configuration><configurationFile>src/main/resources/mybatis/generatorconfig.xml</configurationFile><verbose>true</verbose><overwrite>true</overwrite></configuration><dependencies><dependency><groupId>cn.zuowenjun.boot.mybatis.plugin</groupId><artifactId>cn.zuowenjun.boot.mybatis.plugin</artifactId><version>1.0</version><scope>system</scope><systemPath>${basedir}/src/main/libs/cn.zuowenjun.boot.mybatis.plugin.jar</systemPath></dependency></dependencies></plugin>

如果4步完成后，最后执行maven buid的生成mybatis代码过程即可，最后查看生成的mapper及xml都会有对应的自定义方法，在此就不再贴出结果了。

2.5进阶用法：利用Mybatis的继承机制实现添加额外自定义方法

如2.4节所述，我们可以通过自定义plugin来实现添加额外自定义的方法，而且不用担心被覆盖，但可能实现有点麻烦（里面用到了反射），有没有简单一点的办法呢？当然有，即可以先使用Mybatis Generator框架生成默代代码，然后再结合使用2.2所述方法（手写mapper接口类及mapper XML），利用mapper XML的继承特性完成添加自定义方法的过程中，具体步骤与2.2相同，在此贴出（注意前提是先自动生成代码，然后再操作如下步骤）

2.5.1.定义扩展mapper接口类（ShoppingOrderExtMapper，扩展ShoppingOrderMapper，它们之间无需继承），代码如下：（很简单，就是定义了一个特殊用途的方法）

package cn.zuowenjun.boot.mapper;import java.util.List;import cn.zuowenjun.boot.domain.ShoppingOrder;public interface ShoppingOrderExtMapper {List<ShoppingOrder> selectAllByShopper(String shopper);}

2.5.2.编写对应的ShoppingOrderExtMapper.xml，这里面就要用到继承，继承主要是resultMap【实现继承用：extends=要继承的mapper xml resultMap】，这样就不用两个地方都为一个实体类写结果映射配置了，其余的都按一个新的mapper XML配置来设计即可，代码如下：

<?xml version="1.0" encoding="UTF-8"?><!DOCTYPE mapper PUBLIC "-////DTD Mapper 3.0//EN" "/dtd/mybatis-3-mapper.dtd" ><mapper namespace="cn.zuowenjun.boot.mapper.ShoppingOrderExtMapper"><resultMap id="BaseResultMap" type="cn.zuowenjun.boot.domain.ShoppingOrder" extends="cn.zuowenjun.boot.mapper.ShoppingOrderMapper.BaseResultMap"></resultMap><select id="selectAllByShopper" resultMap="BaseResultMap" parameterType="string">select * from TA_TestShoppingOrder where shopper=#{shopper}</select></mapper>

如上两步即完成扩展添加额外自定义的方法，又不用担心重复执行生成代码会被覆盖掉，只是使用时需要单独注册到spring，单独实例，虽不完美但弥补了默认生成代码的不足也是可行的。

2.6使用SpringBootTest + junit测试基于Mybatis框架实现的DAO类

在此不详情说明junit测试的用法，网上大把资源，只是单独说明结合SpringBootTest注解，完成单元测试，先看单元测试代码：

package cn.zuowenjun.springbootdemo;import java.math.BigDecimal;import java.util.Date;import java.util.List;import org.junit.Assert;import org.junit.Test;import org.junit.runner.RunWith;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.boot.test.context.SpringBootTest;import org.springframework.test.annotation.Rollback;import org.springframework.test.context.junit4.SpringRunner;import org.springframework.transaction.annotation.Transactional;import cn.zuowenjun.boot.SpringbootdemoApplication;import cn.zuowenjun.boot.domain.*;import cn.zuowenjun.boot.mapper.GoodsMapper;import cn.zuowenjun.boot.mapper.ShoppingOrderDetailMapper;import cn.zuowenjun.boot.mapper.ShoppingOrderMapper;@RunWith(SpringRunner.class)@SpringBootTest(classes=SpringbootdemoApplication.class)public class ShoppingOrderMapperTests {@Autowiredprivate ShoppingOrderMapper shoppingOrderMapper;@Autowiredprivate ShoppingOrderDetailMapper shoppingOrderDetailMapper;@Autowiredprivate GoodsMapper goodsMapper;@Transactional@Rollback(false) //不加这个，默认测试完后自动回滚 @Testpublic void testInsertShoppingOrder() {Goods goods= goodsMapper.get(1);ShoppingOrder shoppingOrder=new ShoppingOrder();shoppingOrder.setShopper("zuowenjun");shoppingOrder.setIscompleted(false);shoppingOrder.setTotalprice(BigDecimal.valueOf(0));shoppingOrder.setTotalqty(1);shoppingOrder.setCreateby("zuowenjun");shoppingOrder.setCreatetime(new Date());int orderId= shoppingOrderMapper.insert(shoppingOrder);shoppingOrder.setId(orderId);ShoppingOrderDetail shoppingOrderDetail=new ShoppingOrderDetail();shoppingOrderDetail.setGoodsid(goods.getId());shoppingOrderDetail.setShoppingorderid(shoppingOrder.getId());shoppingOrderDetail.setQty(10);shoppingOrderDetail.setTotalprice(BigDecimal.valueOf(shoppingOrderDetail.getQty()).multiply(goods.getPrice()));shoppingOrderDetail.setCreateby("zuowenjun");shoppingOrderDetail.setCreatetime(new Date());shoppingOrderDetailMapper.insert(shoppingOrderDetail);List<ShoppingOrderDetail> orderDetails= shoppingOrderDetailMapper.selectByOrderId(shoppingOrder.getId());if(orderDetails!=null && orderDetails.size()>0) {for(ShoppingOrderDetail od:orderDetails) {System.out.println("id:" + od.getId() + ",goodsid:" + od.getGoodsid());}}Assert.assertTrue(orderDetails.size()>0); }}

View Code

与Junit单元测试用法基本相同，唯一的区别就是在单元测试的类上添加@SpringBootTest，并指定启动类（如代码中所示：@SpringBootTest(classes=SpringbootdemoApplication.class)），另外注意一点：如果测试方法使用@Transactional注解，那么当测试完成后会回滚（即并不会提交事务），如果想完成事务的提交，则需如代码中所示添加@Rollback(false)，其中false指不回滚，true则为回滚。

三、简单演示集成Thymeleaf模板引擎（这里只是用一个简单的页面演示效果，由于现在都流行前后端分离，故只需了解即可）

说明：Thymeleaf是spring MVC的端视图引擎，与JSP视图引擎类似，只不过在spring boot项目中默认支持Thymeleaf（Thymeleaf最大的优点是视图中不含JAVA代码，不影响UI美工及前端设计），而JSP不建议使用，当然也可以通过添加相关的JSP的JAR包依赖，实现JSP视图，具体请自行网上查找资源，同时spring MVC +JSP视图的用法可以参见该系列的上篇文章

3.1.添加Thymeleaf的maven依赖，POM配置如下：

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

3.2.编写后端controller，以便响应用户请求，代码如下：（这个与普通spring MVC+JSP相同，区别在VIEW）

package cn.zuowenjun.boot.controller;import java.util.List;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Controller;import org.springframework.ui.Model;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.RequestMapping;import cn.zuowenjun.boot.domain.*;import cn.zuowenjun.boot.service.*;@Controller@RequestMapping("/test")public class TestController {@Autowiredprivate ShopUserService shopUserService;@GetMapping("/userlist")public String list(Model model) {List<ShopUser> users= shopUserService.getAll();model.addAttribute("title", "测试使用thymeleaf模板引擎展示数据");model.addAttribute("users", users);//可以在application.properties添加如下配置，以改变thymeleaf的默认设置//spring.thymeleaf.prefix="classpath:/templates/" 模板查找路径//spring.thymeleaf.suffix=".html" 模板后缀名return "/test";//默认自动查找路径：src/main/resources/templates/*.html }}

3.3编写前端视图html模板页面，最后演示效果

HTML视图页面代码：（th:XXX为Thymeleaf的模板特有的标识符，${xxx}这是SP EL表达式，这个之前讲过的，很简单，不展开说明）

<!DOCTYPE html><html xmlns:th=""><head><meta charset="UTF-8"><title>test User List -power by thymeleaf</title><style type="text/css">table{border:2px solid blue;border-collapse:collapse;width:98%;}table *{border:1px solid blue;text-align:center;}thead{background-color:purple;color:yellow;}th,td{padding:5px;}#copy{margin-top:100px;text-align: center;}</style></head><body><h1 th:text="${title}"></h1><table><thead><tr><th>SeqNo</th><th>userId</th><th>nickName</th><th>depositAmount</th></tr></thead><tbody><tr th:if="${users}!=null" th:each="user,iterStat:${users}"><td th:text="${iterStat.index}+1">1</td><td th:text="${user.userid}"></td><td th:text="${user.nickname}">梦在旅途</td><td th:text="${user.depositamount}">520</td></tr><tr th:unless="${users.size()} gt 0"><td colspan="4">暂无相关记录！</td></tr></tbody></table><p id="copy">Copyright ©<span th:text="${#dates.format(#dates.createToday(),'yyyy')}"></span> and demo all rights.</p></body></html>

View Code

最后浏览：http://localhost:8080/test/userlist，效果如下图示：

四、利用VUE+SpringMVC Rest API编写实现前后端分离的电商购物Demo（浏览商品、添加购物车、下单、完成）

说明：由于数据访问层（或称：数据持久层）已由Mybatis Generator完成了，现在就只要编写业务领域服务层（接口层、实现层），API接入层即可完成后端开发，然后再开发设计前端页面即可（前端与后端交互使用AJAX）

4.1.在cn.zuowenjun.boot.service包中定义相关的业务领域服务接口

//ShopUserService.javapackage cn.zuowenjun.boot.service;import java.util.List;import cn.zuowenjun.boot.domain.ShopUser;public interface ShopUserService {List<ShopUser> getAll();ShopUser get(String userId);String getCurrentLoginUser();String login(String uid,String pwd);void logout();}//GoodsService.javapackage cn.zuowenjun.boot.service;import java.util.List;import org.springframework.web.multipart.MultipartFile;import cn.zuowenjun.boot.domain.*;public interface GoodsService {List<Goods> getGoodsListByPage(int pageSize,int pageNo);List<Goods> getGoodsListByCategory(int categoryId);List<Goods> getGoodsListByMultIds(int...goodsIds);Goods getGoods(int id);void insertGoods(Goods goods,MultipartFile uploadGoodsPic);void updateGoods(Goods goods,MultipartFile uploadGoodsPic);void deleteGoods(int id);List<GoodsCategory> getAllGoodsCategoryList();void insertGoodsCategory(GoodsCategory goodsCategory);void updateGoodsCategory(GoodsCategory goodsCategory);void deleteGoodsCategory(int id);}//ShoppingOrderService.javapackage cn.zuowenjun.boot.service;import java.util.List;import cn.zuowenjun.boot.domain.*;public interface ShoppingOrderService {ShoppingOrder getShoppingOrder(int id);List<ShoppingOrder> getShoppingOrderList(String shopper);List<ShoppingOrderDetail> getShoppingOrderDetail(int orderId);boolean createShoppingOrderByShopper(String shopper);void insertShoppingOrderWithDetail(ShoppingOrder order,List<ShoppingOrderDetail> orderDetails);void deleteShoppingOrderDetail(int orderDetailId);void deleteShoppingOrderWithDetail(int orderId);void updateShoppingOrder(ShoppingOrder order);List<ShoppingCart> getShoppingCartList(String shopper);int getShoppingCartBuyCount(String shopper);void insertShoppingCart(ShoppingCart shoppingCart);void deleteShoppingCart(int shoppingCartId);void clearShoppingCart(String shopper);}

View Code

如上代码示，我仅定义了三个service接口，分别是：ShopUserService（用户服务）、GoodsService（商品服务【含：商品类别、商品信息】）、ShoppingOrderService（购物订单服务【含：购物车、购物订单、购物订单明细】），我说过服务层不一定是与DB中的表一一对应的，而是应该体现服务内聚（即：业务领域），如果单纯的与DAO层一样，一个service与一个dao对应，那就失去了分层的意义，而且还增加了复杂度。个人看法。

4.2在cn.zuowenjun.boot.service.impl包中实现4.1中相关的业务领域服务接口（代码很简单，主要是实现接口的一些方法，唯一有点特别是文件上传，事务，记录日志，这些通过代码就能看明白就不再详情描述了）

//ShopUserServiceImpl.javapackage cn.zuowenjun.boot.service.impl;import java.util.List;import javax.servlet.http.HttpServletRequest;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Service;import org.springframework.web.context.request.RequestContextHolder;import org.springframework.web.context.request.ServletRequestAttributes;import cn.zuowenjun.boot.EShopProperties;import cn.zuowenjun.boot.domain.ShopUser;import cn.zuowenjun.boot.mapper.ShopUserMapper;import cn.zuowenjun.boot.service.ShopUserService;@Servicepublic class ShopUserServiceImpl implements ShopUserService {private ShopUserMapper shopUserMapper;private EShopProperties shopProperties;@Autowiredpublic ShopUserServiceImpl(ShopUserMapper shopUserMapper,EShopProperties shopProperties) {this.shopUserMapper=shopUserMapper;this.shopProperties=shopProperties;}@Overridepublic List<ShopUser> getAll() {return shopUserMapper.selectAll();}@Overridepublic ShopUser get(String userId) {return shopUserMapper.selectByPrimaryKey(userId);}@Overridepublic String getCurrentLoginUser() {if(getRequest().getSession().getAttribute("loginUser")==null) {return null;}return getRequest().getSession().getAttribute("loginUser").toString();}@Overridepublic String login(String uid, String pwd) {if(shopProperties.getShopUserId().equalsIgnoreCase(uid) && shopProperties.getShopUserPwd().equals(pwd)) {getRequest().getSession().setAttribute("loginUser", uid);return null;}else {return "用户名或密码不正确！";}}@Overridepublic void logout() {getRequest().getSession().removeAttribute("loginUser");}private HttpServletRequest getRequest() {HttpServletRequest request= ((ServletRequestAttributes)RequestContextHolder.getRequestAttributes()).getRequest();return request;}}//GoodsServiceImpl.javapackage cn.zuowenjun.boot.service.impl;import java.io.File;import java.io.IOException;import java.util.List;import java.util.UUID;import javax.servlet.ServletContext;import javax.servlet.http.HttpServletRequest;import org.slf4j.Logger;import org.slf4j.LoggerFactory;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Service;import org.springframework.transaction.annotation.Transactional;import org.springframework.web.context.ContextLoader;import org.springframework.web.context.WebApplicationContext;import org.springframework.web.context.request.RequestContextHolder;import org.springframework.web.context.request.ServletRequestAttributes;import org.springframework.web.multipart.MultipartFile;import cn.zuowenjun.boot.domain.*;import cn.zuowenjun.boot.mapper.GoodsCategoryMapper;import cn.zuowenjun.boot.mapper.GoodsMapper;import cn.zuowenjun.boot.service.GoodsService;@Servicepublic class GoodsServiceImpl implements GoodsService {private static Logger logger=LoggerFactory.getLogger(GoodsServiceImpl.class);@Autowiredprivate GoodsMapper goodsMapper;@Autowiredprivate GoodsCategoryMapper categoryMapper;@Overridepublic List<Goods> getGoodsListByPage(int pageSize,int pageNo){return goodsMapper.getListByPage(pageSize, pageNo);}@Overridepublic List<Goods> getGoodsListByCategory(int categoryId) {return goodsMapper.getList(categoryId);}@Overridepublic List<Goods> getGoodsListByMultIds(int... goodsIds) {return goodsMapper.getListByMultIds(goodsIds);}@Overridepublic Goods getGoods(int id) {return goodsMapper.get(id);}@Transactional@Overridepublic void insertGoods(Goods goods, MultipartFile uploadGoodsPic) {String picPath= saveGoodsPic(uploadGoodsPic);if(picPath!=null && !picPath.isEmpty()) {goods.setPicture(picPath);}goodsMapper.insert(goods);GoodsCategory gcate= categoryMapper.get(goods.getCategoryId());gcate.setGoodsCount(gcate.getGoodsCount()+1);categoryMapper.update(gcate);logger.info("inserted new goods - id:" + goods.getId());}@Overridepublic void updateGoods(Goods goods,MultipartFile uploadGoodsPic) {String picPath= saveGoodsPic(uploadGoodsPic);if(picPath!=null && !picPath.isEmpty()) {goods.setPicture(picPath);}goodsMapper.update(goods);logger.info("update goods - id:" + goods.getId());}@Transactional@Overridepublic void deleteGoods(int id) {Goods g= goodsMapper.get(id);goodsMapper.delete(g.getId());GoodsCategory gcate= categoryMapper.get(g.getCategoryId());gcate.setGoodsCount(gcate.getGoodsCount()-1);categoryMapper.update(gcate);//如果有图片，则同时删除图片if(g.getPicture()!=null && !g.getPicture().isEmpty()) {String picPath= getRequest().getServletContext().getRealPath("/") + g.getPicture();File file = new File(picPath);if(file.exists()) {file.delete();}}logger.info("deleted goods - id:" + g.getId());}@Overridepublic List<GoodsCategory> getAllGoodsCategoryList(){return categoryMapper.getAll();}@Overridepublic void insertGoodsCategory(GoodsCategory goodsCategory) {categoryMapper.insert(goodsCategory);}@Overridepublic void updateGoodsCategory(GoodsCategory goodsCategory) {categoryMapper.update(goodsCategory);}@Overridepublic void deleteGoodsCategory(int id) {categoryMapper.delete(id);}private String saveGoodsPic(MultipartFile uploadGoodsPic) {if(uploadGoodsPic==null || uploadGoodsPic.isEmpty()) {return null;}String fileName = uploadGoodsPic.getOriginalFilename();String extName = fileName.substring(fileName.lastIndexOf("."));String newFileName=UUID.randomUUID().toString()+extName;File file = new File(getFileSavePath(newFileName));if(!file.exists()) {file.getParentFile().mkdirs();}try {uploadGoodsPic.transferTo(file);//return file.toURI().toURL().toString();return getUrlPath(file.getAbsolutePath());} catch (IllegalStateException e) {e.printStackTrace();} catch (IOException e) {e.printStackTrace();}return null;}private String getFileSavePath(String fileName) {String realPath =getRequest().getServletContext().getRealPath("/uploadimgs/");return realPath + fileName;}private String getUrlPath(String filePath) {String rootPath= getRequest().getServletContext().getRealPath("/");return filePath.replace(rootPath, "").replaceAll("\\\\", "/");}private HttpServletRequest getRequest() {HttpServletRequest request= ((ServletRequestAttributes)RequestContextHolder.getRequestAttributes()).getRequest();return request;}}//ShoppingOrderServiceImpl.javapackage cn.zuowenjun.boot.service.impl;import java.math.BigDecimal;import java.util.ArrayList;import java.util.Date;import java.util.List;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.stereotype.Service;import org.springframework.transaction.annotation.Transactional;import cn.zuowenjun.boot.domain.*;import cn.zuowenjun.boot.mapper.*;import cn.zuowenjun.boot.service.ShoppingOrderService;@Servicepublic class ShoppingOrderServiceImpl implements ShoppingOrderService {@Autowiredprivate ShoppingOrderMapper orderMapper;@Autowiredprivate ShoppingOrderDetailMapper orderDetailMapper;@Autowiredprivate ShoppingCartMapper shoppingCartMapper;@Autowiredprivate ShoppingOrderExtMapper shoppingOrderExtMapper;@Overridepublic void insertShoppingCart(ShoppingCart shoppingCart) {ShoppingCart cart=shoppingCartMapper.get(shoppingCart.getShopper(), shoppingCart.getGoodsId());if(cart==null) {shoppingCartMapper.insert(shoppingCart);}else {cart.setQty(cart.getQty()+shoppingCart.getQty());shoppingCartMapper.update(cart);}}@Overridepublic void deleteShoppingCart(int shoppingCartId) {shoppingCartMapper.deleteItem(shoppingCartId);}@Overridepublic ShoppingOrder getShoppingOrder(int id) {return orderMapper.selectByPrimaryKey(id);}@Overridepublic List<ShoppingOrder> getShoppingOrderList(String shopper) {return shoppingOrderExtMapper.selectAllByShopper(shopper);}@Overridepublic List<ShoppingOrderDetail> getShoppingOrderDetail(int orderId) {return orderDetailMapper.selectByOrderId(orderId);}@Transactional@Overridepublic boolean createShoppingOrderByShopper(String shopper) {List<ShoppingCart> carts= shoppingCartMapper.getList(shopper);if(carts==null || carts.size()<=0) {return false;}int totalQty=0;BigDecimal totalPrc=BigDecimal.valueOf(0);List<ShoppingOrderDetail> orderDetails=new ArrayList<>();for(ShoppingCart c:carts) {totalQty+=c.getQty();BigDecimal itemPrc=c.getInGoods().getPrice().multiply(BigDecimal.valueOf(c.getQty()));totalPrc=totalPrc.add(itemPrc);ShoppingOrderDetail od=new ShoppingOrderDetail();od.setGoodsid(c.getGoodsId());od.setQty(c.getQty());od.setTotalprice(itemPrc);od.setCreateby(shopper);od.setCreatetime(new Date());orderDetails.add(od);}ShoppingOrder order=new ShoppingOrder();order.setShopper(shopper);order.setTotalqty(totalQty);order.setTotalprice(totalPrc);order.setCreateby(shopper);order.setCreatetime(new Date());order.setIscompleted(false);insertShoppingOrderWithDetail(order,orderDetails);clearShoppingCart(shopper);return true;}@Transactional@Overridepublic void insertShoppingOrderWithDetail(ShoppingOrder order, List<ShoppingOrderDetail> orderDetails) {orderMapper.insert(order);int orderId=order.getId();for(ShoppingOrderDetail od:orderDetails) {od.setShoppingorderid(orderId);orderDetailMapper.insert(od);}}@Overridepublic void deleteShoppingOrderDetail(int orderDetailId) {orderDetailMapper.deleteByPrimaryKey(orderDetailId);}@Transactional@Overridepublic void deleteShoppingOrderWithDetail(int orderId) {orderMapper.deleteByPrimaryKey(orderId);orderDetailMapper.deleteByOrderId(orderId);}@Overridepublic void updateShoppingOrder(ShoppingOrder order) {orderMapper.updateByPrimaryKey(order);}@Overridepublic List<ShoppingCart> getShoppingCartList(String shopper) {return shoppingCartMapper.getList(shopper);}@Overridepublic int getShoppingCartBuyCount(String shopper) {return shoppingCartMapper.getBuyCount(shopper);}@Overridepublic void clearShoppingCart(String shopper) {shoppingCartMapper.delete(shopper);}}

View Code

4.3编写基于VUE前端框架实现的相关UI界面

4.3.1.VUE是什么？如何使用VUE前端框架设计页面？认真阅读官方中文教程就可以了：/v2/guide/index.html，这里只是着重说明一下，VUE是实现了MVVM框架，使用VUE的核心组件：模板、路由、数据双向绑定等特性能够设计出很牛逼的SPA（单WEB页面的多UI交互的应用），本人（梦在旅途）VUE只是初学者，故在本示例中我只是使用VUE的最基本的一些功能属性（如：el：指定VUE的渲染范围（绑定的作用域）、data（数据模型MODEL）、computed（动态计算属性）、created（VUE初始化后触发的事件）、methods（绑定自定义方法））

4.3.2.由于采用前后端分离，完全可以一个项目全是静态的VUE HTML模板，另一个项目是基于spring boot REST Api项目，但这里是演示，故采取在同一个项目中，我这里是在webapp目录下创建相关的HTML视图页面，如果不在同一个项目中，注意基于spring boot REST Api项目中需要设置能够允许跨域访问，所有HTML视图代码如下：

index.html（商品列表，主页）

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>梦在旅途的电商小店Demo-Power by Spring Boot+MyBatis-Boot</title><meta name="author" content="" ><script src="/npm/vue" type="text/javascript"></script><script src="/vue-resource/1.5.1/vue-resource.min.js"></script><style type="text/css">#catesbox ul li{float:left;padding:5px;margin-right:20px;border:1px solid green;display: inline-block;cursor:pointer;}.clfx {clear:both;display:block;}.gpic{width:100px;height:100px;text-align:center;vertical-align:middle;}#goodsbox table {width:100%;border-collapse:collapse;}#goodsbox table tr >*{border:1px solid blue;padding:5px;}li.active{background-color:orange;font-weight:bold;}#copy{margin-top:20px;text-align: center;}body{padding-top:51px;}#topbar{height:50px;line-height:50px;margin:0;width:100%;background-color:WhiteSmoke;position: fixed;top:0;border-bottom:1px solid darkgray;text-align: right;}</style></head><body><div id="app"><div id="topbar"><a href="/cartlist.html" target="_blank">购物车(已加入商品数量：{{cartCount}})</a> | <a href="/orderlist.html" target="_blank">订单中心</a> | <a href="/admin.html" target="_blank">管理后台</a>    </div><h2>商品类目：</h2><div id="catesbox"><ul v-for="c in cates"><li v-on:click="getGoodsListByCategory(c)" v-bind:class="{active:c.categoryName==curcate}">{{c.categoryName}}({{c.goodsCount}})</li></ul><div class="clfx"></div></div><h2>当前浏览的商品分类：<span>{{curcate}}</span></h2><div id="goodsbox"><table><tr><th>商品图片</th><th>商品标题</th><th>价格</th><th>操作</th></tr><tr v-for="g in goods"><td><img v-bind:src="g.picture" class="gpic"></td><td><a v-bind:href="'/detail.html?gid=' + g.id" target="_blank">{{g.title}}</a></td><td>￥{{g.price}}</td><td><button v-on:click="addToShoppingCart(g)">加入购物车</button></td></tr></table></div></div><p id="copy">Copyright ©   and demo all rights.</p><script type="text/javascript">var vm = new Vue({el:"#app",data:{cartCount:0,cates:[],goods:[],curcate:"ALL"},created:function(){var self = this;this.$http.get('/api/categorys').then(function(res){self.cates=res.body; //alert(JSON.stringify(self.cates));},function(){alert("获取categorys失败！");});this.$http.get('/api/cartlist').then(function(res){self.cartCount=res.body.length; //alert(JSON.stringify(self.goods));},function(){alert("获取购物车信息失败！");});//按分页检索商品列表this.getGoodsListByPage(10,1);},methods:{getGoodsListByCategory:function(cate){var self = this;//按类别检索商品列表this.$http.get('/api/goods/' + cate.id).then(function(res){self.goods=res.body; self.curcate=cate.categoryName;//alert(JSON.stringify(self.goods)); },function(){alert("获取goods失败！");});},getGoodsListByPage:function(ps,pno){var self = this;//按分页检索商品列表this.$http.get('/api/goods' +'?pagesize='+ps +'&page=' + pno).then(function(res){self.goods=res.body; self.curcate="ALL";//alert(JSON.stringify(self.goods)); },function(){alert("获取goods失败！");});},addToShoppingCart:function(goods){//加入购物车var self = this;var qty=prompt('请输入购买数量',1);this.$http.post('/api/addToShoppingCart',{goodsid:goods.id,goodsqty:qty}).then(function(res){var rs=res.body;alert(rs.msg);self.cartCount=rs.data.cartCount;},function(){alert("加入购物车失败");});}}});</script></body></html>

View Code

detail.html（商品详情）

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>商品详情 -梦在旅途的电商小店</title><meta name="author" content="" ><script src="/npm/vue" type="text/javascript"></script><script src="/vue-resource/1.5.1/vue-resource.min.js"></script><style type="text/css">.clfx {clear:both;display:block;}.row{width:100%;margin:10px 0;}.lbox{float:left;width:40%;min-height: 100px;}.rbox{float:right;width:50%;}.rbox ul li{margin:50px auto;}body{padding-top:51px;}#topbar{height:50px;line-height:50px;margin:0;width:100%;background-color:WhiteSmoke;position: fixed;top:0;border-bottom:1px solid darkgray;text-align: right;}</style></head><body><div id="app"><div id="topbar"><a href="/cartlist.html" target="_blank">购物车(已加入商品数量：{{cartCount}})</a> | <a href="/admin.html" target="_blank">管理后台</a>    </div><div class="row"><div class="lbox"><img :src="goods.picture" style="width:100%;height:100%;margin:0;padding:0;"></div><div class="rbox"><ul><li><strong>{{goods.title}}</strong></li><li>价格：￥{{goods.price}}</li><li>购买数量：<input v-model="buyqty" value="1"></li><li>购买价格：<span>{{buyprice}}</span></li><li><button @click="addToShoppingCart">加入购物车</button></li></ul></div><div class="clfx"></div></div><div class="row"><h2>商品详细描述：</h2><hr/><p>{{goods.introduction}}</p></div></div><script type="text/javascript">var vm=new Vue({el:"#app",data:{cartCount:0,buyqty:1,goods:{}},created:function(){var gid= getQueryString("gid");var self = this;this.$http.get('/api/goods-' + gid).then(function(res){self.goods=res.body; //alert(JSON.stringify(self.goods));},function(){alert("获取goods失败！");});this.$http.get('/api/cartlist').then(function(res){self.cartCount=res.body.length; //alert(JSON.stringify(self.goods));},function(){alert("获取购物车信息失败！");});},computed:{buyprice:function(){return (this.buyqty * this.goods.price).toFixed(2);}},methods:{addToShoppingCart:function(){//alert(this.buyqty);//加入购物车var self = this;this.$http.post('/api/addToShoppingCart',{goodsid:this.goods.id,goodsqty:this.buyqty}).then(function(res){var rs=res.body;alert(rs.msg);self.cartCount=rs.data.cartCount;},function(){alert("加入购物车失败");});}}});function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; }</script></body></html>

View Code

cartlist.html（购物车）

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>购物车详情 -梦在旅途的电商小店</title><meta name="author" content="" ><script src="/npm/vue" type="text/javascript"></script><script src="/vue-resource/1.5.1/vue-resource.min.js"></script><style type="text/css">.toolbar{margin:10px 5px;}.carttable{width:100%;margin:0px;padding:5px;border:1px solid gray;}.carttable tr >*{border-bottom:1px solid gray;padding:5px;text-align: center;}.buybtn{background-color:green;border:none;width:280px;padding:20px;color:white;font-size:20pt;}#copy{margin-top:20px;text-align: center;}</style></head><body><div id="app"><div class="toolbar"><button @click="deleteItem()" :disabled="carts.length==0">移出购物车</button> | <button @click="clearCart()" :disabled="carts.length==0">清空购物车</button></div><div><table class="carttable"><tr><th>选择</th><th>商品ID</th><th>商品名称</th><th>预购买数量</th><th>价格</th><th>添加时间</th></tr><tr v-for="c in carts"><td><input type="checkbox" class="chkitem" @click="checkitem(c,$event.target)" :checked="chkedItemIds.indexOf(c.id)>-1"></td><td>{{c.goodsId}}</td><td>{{c.inGoods.title}}</td><td>{{c.qty}}</td><td>￥{{(c.inGoods.price * c.qty).toFixed(2)}}</td><td>{{c.addedTime}}</td></tr><tr v-if="carts.length==0" style="text-align: center;"><td colspan="6">空空如也，赶紧选购商品吧！~</td></tr></table></div><p style="text-align: center;"><button class="buybtn" @click="createOrder()" :disabled="carts.length==0">立即下单</button></p></div><p id="copy">Copyright ©   and demo all rights.</p><script type="text/javascript">var vm=new Vue({el:"#app",data:{carts:[],chkedItemIds:[]},created:function(){var self = this;this.$http.get('/api/cartlist').then(function(res){self.carts=res.body; //alert(JSON.stringify(self.carts));},function(){alert("获取购物车信息失败！");});},methods:{checkitem:function(cart,chk){//alert(chk.checked);if(chk.checked){this.chkedItemIds.push(cart.id);}else{this.chkedItemIds.remove(cart.id);}},deleteItem:function(){var self = this;//alert(JSON.stringify(self.chkedItemIds));this.$http.post('/api/deletecartitems-many',self.chkedItemIds).then(function(res){ self.carts= self.carts.filter(function(e){ return self.chkedItemIds.indexOf(e.id)<=-1;});alert(res.body.msg);},function(){alert("删除失败！");});},clearCart:function(){var self = this;this.$http.post('/api/deletecartitems-all').then(function(res){ self.carts=[];alert(res.body.msg);},function(){alert("删除失败！");});},createOrder:function(){var self = this;this.$http.post('/api/createorder').then(function(res){ alert(res.body.msg);if(res.body.code==0){//如查下单成功，则清空购物车 self.carts=[];}},function(){alert("下单失败！");});}}});Array.prototype.remove = function(val) { var index = this.indexOf(val); if (index > -1) { this.splice(index, 1); } };</script></body></html>

View Code

orderlist.html（订单中心）

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>订单详情 -梦在旅途的电商小店</title><script src="/npm/vue" type="text/javascript"></script><script src="/vue-resource/1.5.1/vue-resource.min.js"></script><style type="text/css">table{border:solid 1px blue;border-collapse: collapse;width:100%;margin:10px 1px;}table tr >*{border:solid 1px blue,padding:5px;border:dotted 1px gray;}.cfmbar{text-align: center;}.cfmbar button{border:none;background-color:blue;color:#ffffff;padding:10px 50px;}#copy{margin-top:20px;text-align: center;}</style></head><body><div id="app"><div><h2>订单列表：</h2><table><tr><th>订单号</th><th>商品数量</th><th>订单价格</th><th>完成否(收货确认)</th><th>创建时间</th><th>查看订单详情</th></tr><tr v-for="o in shoppingOrders"><td>{{o.id}}</td><td>{{o.totalqty}}</td><td>{{o.totalprice.toFixed(2)}}</td><td>{{o.iscompleted?"已收货":"待收货"}}</td><td>{{o.createtime}}</td><td><button @click="showOrderDetail(o)">查看</button></td></tr><tr v-if="shoppingOrders.length==0" style="text-align: center;"><td colspan="6">没有任何订单信息！</td></tr></table></div><div v-if="viewOrder!=null"><h3>订单号【{{viewOrder.id}}】详情：</h3><table><tr><th>商品ID</th><th>商品名称</th><th>购买数量</th><th>费用</th></tr><tr v-for="od in viewOrderDetails.details"><td>{{od.goodsid}}</td><td>{{goodsName(od)}}</td><td>{{od.qty}}</td><td>￥{{od.totalprice.toFixed(2)}}</td></tr></table><p class="cfmbar" v-if="!viewOrder.iscompleted"><button @click="confirmOrderCompleted(viewOrder)" >确认完成（已收货）</button></p></div></div><p id="copy">Copyright ©   and demo all rights.</p><script type="text/javascript">var vm=new Vue({el:"#app",data:{shoppingOrders:[],viewOrder:null,viewOrderDetails:null},created:function(){var self = this;this.$http.get('/api/orders').then(function(res){self.shoppingOrders=res.body; //alert(JSON.stringify(self.shoppingOrders));},function(){alert("获取orders失败！");});},computed:{goodsName(){//利用JS闭包实现传参return function(od){var goods= this.viewOrderDetails.goodss.filter(function(g){return g.id==od.goodsid })[0];//alert(od.goodsid);return goods.title;}}},methods:{showOrderDetail:function(o){var self = this;this.$http.post('/api/orderdetail',{orderId:o.id}).then(function(res){if(res.body.code==0){self.viewOrderDetails=res.body.data; //alert(JSON.stringify(self.viewOrderDetails));}else{alert(res.body.msg);self.viewOrderDetails=null;o=null;}self.viewOrder=o;},function(){alert("获取orderdetail失败！");});},confirmOrderCompleted:function(o){var self = this;this.$http.post('/api/confirmOrderCompleted',{orderId:o.id}).then(function(res){alert(res.body.msg);if(res.body.code==0){self.viewOrder.iscompleted=true;}}),function(){alert("确认订单完成失败！");};}}});function getQueryString(name) { var reg = new RegExp("(^|&)" + name + "=([^&]*)(&|$)", "i"); var r = window.location.search.substr(1).match(reg); if (r != null) return unescape(r[2]); return null; }</script></body></html>

View Code

admin.html（管理后台，由于DEMO，故只实现商品的增、删功能，其余管理功能未实现，仅作演示）

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>管理后台 -梦在旅途的电商小店</title><meta name="author" content="" ><script src="/npm/vue" type="text/javascript"></script><script src="/vue-resource/1.5.1/vue-resource.min.js"></script><style type="text/css">table{border:solid 1px blue;border-collapse: collapse;width:100%;margin:10px 1px;}table tr >*{border:solid 1px blue,padding:5px;border:dotted 1px gray;}.gpic{width:100px;height:100px;text-align:center;vertical-align:middle;}</style></head><body><div id="app"><fieldset><legend>管理商品：</legend><table><colgroup><col style="width:auto"><col style="width:auto"><col style="width:100px"><col style="width:300px"><col style="width:auto"><col style="width:auto"><col style="width:auto"><col style="width:auto"><col style="width:auto"></colgroup><tr><th>商品ID</th><th>商品名称</th><th>商品图片</th><th>商品介绍</th><th>单价</th><th>类别ID</th><th>最后编辑者</th><th>最后编辑时间</th><th>操作</th></tr><tr style="background-color:orange;"><td>{{editgoods.id}}</td><td><input type="text" v-model="editgoods.title"></td><td><img v-bind:src="editgoods.picture" class="gpic"><input class="upload" type="file" id="gpicfile" @change="selectimg($event.target)" accept="image/png,image/gif,image/jpeg"></td><td><textarea v-model="editgoods.introduction"></textarea></td><td><input type="text" v-model="editgoods.price"></td><td><select v-model="editgoods.categoryId"><option v-for="c in categorys" v-bind:value="c.id">{{c.categoryName}}</option></select></td><td>{{editgoods.lastEditBy}}</td><td>{{editgoods.lastEditTime}}</td><td><button @click="savegoods(editgoods)">保存</button></td></tr><tr v-for="g in goodss"><td>{{g.id}}</td><td>{{g.title}}</td><td><img v-bind:src="g.picture" class="gpic"></td><td>{{g.introduction}}</td><td>{{g.price}}</td><td>{{g.categoryId}}</td><td>{{g.lastEditBy}}</td><td>{{g.lastEditTime}}</td><td><button @click="editgoods(g)" disabled="disabled">修改</button> | <button @click="delgoods(g)">删除</button></td></tr></table></fieldset></div><script type="text/javascript">var vm=new Vue({el:"#app",data:{categorys:[],goodss:[],editgoods:{id:null,title:null,picture:null,price:0.00,introduction:null,categoryId:1,lastEditBy:"zuowenjun",lastEditTime:null}},created:function(){this.$http.get('/api/categorys').then(function(res){this.categorys=res.body; },function(){alert("获取categorys失败！");});this.getGoodsListByPage(100,1);//DEMO,只加载第1页 },methods:{getGoodsListByPage:function(ps,pno){var self = this;//按分页检索商品列表this.$http.get('/api/goods' +'?pagesize='+ps +'&page=' + pno).then(function(res){self.goodss=res.body; //alert(JSON.stringify(self.goods)); },function(){alert("获取goods失败！");});},selectimg:function(el){let gpic=el.files[0];let type=gpic.type;//文件的类型，判断是否是图片let size=gpic.size;//文件的大小，判断图片的大小if('image/gif, image/jpeg, image/png, image/jpg'.indexOf(type) == -1){alert('请选择我们支持的图片格式！');return false;}if(size>3145728){alert('请选择3M以内的图片！');return false;}var uri ='';this.editgoods.picture=URL.createObjectURL(gpic);},savegoods:function(g){var fileDom=document.getElementById("gpicfile");let formData = new FormData();formData.append('id', this.editgoods.id);formData.append('title', this.editgoods.title);formData.append('picture', fileDom.files[0]);formData.append('price', this.editgoods.price);formData.append('introduction', this.editgoods.introduction);formData.append('categoryId', this.editgoods.categoryId);let config = {headers: {'Content-Type': 'multipart/form-data'}}this.$http.post('/api/savegoods', formData, config).then(function (res) {alert(res.body.msg);if(res.body.code==0){this.goodss.unshift(res.body.data);//插入到数组最新面this.editgoods={//重新初始化，以便实现清空所有编辑框 id:null,title:null,picture:null,price:0.00,introduction:null,categoryId:1,lastEditBy:"zuowenjun",lastEditTime:null};}});},delgoods:function(g){this.$http.get('/api/delgoods/' + g.id).then(function(res){alert(res.body.msg); if(res.body.code==0){this.goodss.remove(g);}},function(){alert("删除goods失败！");});}}});Array.prototype.remove = function(val) { var index = this.indexOf(val); if (index > -1) { this.splice(index, 1); } };</script></body></html>

View Code

前端交互所需要API（因为是DEMO，故所有的API ACTION方法都在Apicontroller中），代码如下：

package cn.zuowenjun.boot.controller;import java.math.BigDecimal;import java.util.Date;import java.util.HashMap;import java.util.List;import java.util.Map;import javax.servlet.http.HttpServletRequest;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.web.bind.annotation.GetMapping;import org.springframework.web.bind.annotation.PathVariable;import org.springframework.web.bind.annotation.PostMapping;import org.springframework.web.bind.annotation.RequestBody;import org.springframework.web.bind.annotation.RequestMapping;import org.springframework.web.bind.annotation.RequestMethod;import org.springframework.web.bind.annotation.RequestParam;import org.springframework.web.bind.annotation.RestController;import org.springframework.web.multipart.MultipartFile;import cn.zuowenjun.boot.domain.*;import cn.zuowenjun.boot.service.*;/** ALL REST API */@RestController@RequestMapping("/api")public class ApiController {@Autowiredprivate GoodsService goodsService;@Autowiredprivate ShoppingOrderService shoppingOrderService;@Autowiredprivate ShopUserService shopUserService;private String getCurrentShopper() {String shopper = shopUserService.getCurrentLoginUser();return shopper;}@PostMapping(value="/login",produces = "application/json;charset=utf-8")public ApiResultMsg login(@RequestBody Map<String,String> requestMap) {String userid=requestMap.get("userid");String upwd=requestMap.get("upwd");String loginResult= shopUserService.login(userid, upwd);if(loginResult==null) {return new ApiResultMsg(0,"OK",null);}else {return new ApiResultMsg(-1,"登录失败：" + loginResult,null);}}@GetMapping(value = "/categorys", produces = "application/json;charset=utf-8")public List<GoodsCategory> getAllGoodsCategorys() {return goodsService.getAllGoodsCategoryList();}@GetMapping(value = "/goods/{cateid}", produces = "application/json;charset=utf-8")public List<Goods> getGoodsList(@PathVariable(name = "cateid") int categoryid) {return goodsService.getGoodsListByCategory(categoryid);}@GetMapping(value = "/goods", produces = "application/json;charset=utf-8")public List<Goods> getGoodsList(@RequestParam(name = "pagesize", required = false) String spageSize,@RequestParam(name = "page", required = false) String spageNo) {int pageSize = tryparseToInt(spageSize);int pageNo = tryparseToInt(spageNo);pageSize = pageSize <= 0 ? 10 : pageSize;pageNo = pageNo <= 1 ? 1 : pageNo;return goodsService.getGoodsListByPage(pageSize, pageNo);}@GetMapping(value = "/goodsmany", produces = "application/json;charset=utf-8")public List<Goods> getGoodsListByMultIds(@RequestBody int[] ids) {return goodsService.getGoodsListByMultIds(ids);}@PostMapping(value = "/addToShoppingCart", produces = "application/json;charset=utf-8")public ApiResultMsg addToShoppingCart(@RequestBody Map<String, Integer> json) {int goodsId = json.get("goodsid");int qty = json.get("goodsqty");ApiResultMsg msg = new ApiResultMsg();if (goodsId <= 0) {msg.setCode(101);msg.setMsg("该商品ID无效");return msg;}String shopper = getCurrentShopper();ShoppingCart shoppingCart = new ShoppingCart(0, shopper, goodsId, qty, new Date());shoppingOrderService.insertShoppingCart(shoppingCart);msg.setCode(0);msg.setMsg("添加购物车成功！");int cartCount = shoppingOrderService.getShoppingCartBuyCount(shopper);HashMap<String, Object> data = new HashMap<>();data.put("cartCount", cartCount);msg.setData(data);return msg;}@GetMapping(value = "/goods-{gid}", produces = "application/json;charset=utf-8")public Goods getGoods(@PathVariable("gid") int goodsId) {return goodsService.getGoods(goodsId);}@GetMapping(value = "/cartlist", produces = "application/json;charset=utf-8")public List<ShoppingCart> getShoppingCartList() {String shopper = getCurrentShopper();return shoppingOrderService.getShoppingCartList(shopper);}@PostMapping(value = "/deletecartitems-{mode}", produces = "application/json;charset=utf-8")public ApiResultMsg deleteShoppingCartItems(@PathVariable("mode") String mode,@RequestBody(required = false) int[] cartIds) {if (mode.equalsIgnoreCase("all")) {String shopper = getCurrentShopper();shoppingOrderService.clearShoppingCart(shopper);} else {for (int id : cartIds) {shoppingOrderService.deleteShoppingCart(id);}}return new ApiResultMsg(0, "删除成功！", null);}@PostMapping(value = "/createorder", produces = "application/json;charset=utf-8")public ApiResultMsg createShoppingOrder() {String shopper = getCurrentShopper();ApiResultMsg msg = new ApiResultMsg();if (shoppingOrderService.createShoppingOrderByShopper(shopper)) {msg.setCode(0);msg.setMsg("恭喜你，下单成功！");} else {msg.setCode(101);msg.setMsg("对不起，下单失败，请重试！");}return msg;}@RequestMapping(path = "/orders", produces = "application/json;charset=utf-8", method = RequestMethod.GET) // 等同于@GetMappingpublic List<ShoppingOrder> getShoppingOrderList() {String shopper = getCurrentShopper();return shoppingOrderService.getShoppingOrderList(shopper);}@RequestMapping(path = "/orderdetail", produces = "application/json;charset=utf-8", method = RequestMethod.POST) // 等同于@PostMappingpublic ApiResultMsg getShoppingOrderDetail(@RequestBody Map<String, String> requestJosn) {String orderId = requestJosn.get("orderId");List<ShoppingOrderDetail> orderDetails = shoppingOrderService.getShoppingOrderDetail(tryparseToInt(orderId));ApiResultMsg msg = new ApiResultMsg();if (orderDetails.size() > 0) {int[] goodsIds = new int[orderDetails.size()];for (int i = 0; i < orderDetails.size(); i++) {goodsIds[i] = orderDetails.get(i).getGoodsid();}List<Goods> goodsList = goodsService.getGoodsListByMultIds(goodsIds);HashMap<String, Object> data = new HashMap<>();data.put("details", orderDetails);data.put("goodss", goodsList);msg.setCode(0);msg.setData(data);} else {msg.setCode(101);msg.setMsg("获取订单详情信息失败！");}return msg;}//这里示例配置多个URL请求路径@PostMapping(path= {"/confirmOrderCompleted","/cfmordercompl"},produces="application/json;charset=utf-8")public ApiResultMsg confirmOrderCompleted(@RequestBody Map<String, String> requestJosn) {String reqOrderId = requestJosn.get("orderId");ApiResultMsg msg=new ApiResultMsg();try {int orderId=tryparseToInt(reqOrderId);ShoppingOrder order= shoppingOrderService.getShoppingOrder(orderId);order.setIscompleted(true);shoppingOrderService.updateShoppingOrder(order);msg.setCode(0);msg.setMsg("确认订单完成成功（已收货）");}catch (Exception e) {msg.setCode(101);msg.setMsg("确认订单完成失败：" + e.getMessage());}return msg;}@PostMapping(path="/savegoods",produces="application/json;charset=utf-8",consumes="multipart/form-data")public ApiResultMsg saveGoods(@RequestParam("picture") MultipartFile gpic,HttpServletRequest request) {ApiResultMsg msg=new ApiResultMsg();try{Goods goods=new Goods();goods.setId(tryparseToInt(request.getParameter("id")));goods.setTitle(request.getParameter("title"));goods.setPrice(new BigDecimal(request.getParameter("price")));goods.setIntroduction(request.getParameter("introduction"));goods.setCategoryId(tryparseToInt(request.getParameter("categoryId")));goods.setLastEditBy(getCurrentShopper());goods.setLastEditTime(new Date());if(goods.getId()<=0) {goodsService.insertGoods(goods, gpic);} else {goodsService.updateGoods(goods, gpic);}msg.setCode(0);msg.setMsg("保存成功！");msg.setData(goods);}catch (Exception e) {msg.setCode(101);msg.setMsg("保存失败：" + e.getMessage());}return msg;}@GetMapping(path="/delgoods/{gid}",produces="application/json;charset=utf-8")public ApiResultMsg deleteGoods(@PathVariable("gid") int goodsId) {goodsService.deleteGoods(goodsId);ApiResultMsg msg=new ApiResultMsg();msg.setCode(0);msg.setMsg("删除商品成功！");return msg;}private int tryparseToInt(String str) {try {return Integer.parseInt(str);} catch (Exception e) {return -1;}}}

View Code

REST API controller与普通的MVC controller用法上基本相同，只是REST API ACTION返回的是数据内容本身(@RestController或@Controller+@ResponseBody)，而MVCACTION一般返回view

4.4添加身份认证拦截器、日志记录等

因为演示的是电商购物场景，既有下单又有后台管理，故这里我增加了登录视图及登录拦截器，以完成对部份页面及API的权限控制，实现代码如下：

4.4.1.设计login.html（登录）

<!DOCTYPE html><html><head><meta charset="UTF-8"><title>登录入口 -梦在旅途的电商小店</title><meta name="author" content="" ><script src="/npm/vue" type="text/javascript"></script><script src="/vue-resource/1.5.1/vue-resource.min.js"></script></head><body><div id="app"><form method="post" @submit.prevent="loginsubmit"><p>用户ID：</p><p><input type="text" v-model="uid"></p><p>密码：</p><p><input type="password" v-model="pwd"></p><p><button type="submit">登录</button></p></form></div><script type="text/javascript">var vm=new Vue({el:"#app",data:{uid:null,pwd:null},methods:{loginsubmit:function(){this.$http.post('/api/login',{userid:this.uid,upwd:this.pwd}).then(function(res){var rs=res.body;if(rs.code==0){window.location.href="index.html";}else{alert(rs.msg);}},function(){alert("登录请求失败！");});}}});</script></body></html>

View Code

4.4.2.自定义实现HandlerInterceptor的登录验证拦截器：LoginInterceptor，代码如下：（注意我是将该拦截器放在根包中cn.zuowenjun.boot）

package cn.zuowenjun.boot;import java.io.IOException;import java.io.PrintWriter;import javax.servlet.http.HttpServletRequest;import javax.servlet.http.HttpServletResponse;import javax.servlet.http.HttpSession;import org.slf4j.Logger;import org.slf4j.LoggerFactory;import org.ponent;import org.springframework.web.servlet.HandlerInterceptor;import com.fasterxml.jackson.databind.ObjectMapper;import cn.zuowenjun.boot.domain.ApiResultMsg;@Componentpublic class LoginInterceptor implements HandlerInterceptor {private static Logger logger = LoggerFactory.getLogger(LoginInterceptor.class);@Overridepublic boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler)throws Exception {HttpSession session = request.getSession();if (session.getAttribute("loginUser") == null) {// 未登录则转到登录页面boolean isAjaxRequest = false;boolean isAcceptJSON = false;if (request.getHeader("x-requested-with") != null&& request.getHeader("x-requested-with").equalsIgnoreCase("XMLHttpRequest")) {isAjaxRequest = true;}if (request.getHeader("Accept") != null && request.getHeader("Accept").contains("application/json")) {isAcceptJSON = true;}if(isAjaxRequest || isAcceptJSON) {//使用jackson序列化JSONApiResultMsg msg=new ApiResultMsg(-1,"未登录，禁止访问",null);ObjectMapper mapper = new ObjectMapper();String msgJson= mapper.writeValueAsString(msg);responseJson(response,msgJson);}else {response.sendRedirect("/login.html");}return false;}return true;}private void responseJson(HttpServletResponse response, String json) throws Exception {PrintWriter writer = null;response.setCharacterEncoding("UTF-8");response.setContentType("applcation/json; charset=utf-8");try {writer = response.getWriter();writer.print(json);} catch (IOException e) {logger.error("response error", e);} finally {if (writer != null)writer.close();}}}

View Code

代码比较简单，主要是判断session中是否有记录登录的用户名，如果没有则表示未登录，然后根据是AJAX请求或需要返回JSON的情况则返回JSON，否则直接跳转到login.html页面。

4.4.3.自定义实现WebMvcConfigurer的配置类：SpringbootdemoAppConfigurer，重写addInterceptors方法，在该方法中把LoginInterceptor实例加入到拦截器管道中，以便交由spring MVC进行管理，代码如下：（同样放在根包中）

package cn.zuowenjun.boot;import org.springframework.beans.factory.annotation.Autowired;import org.springframework.context.annotation.Configuration;import org.springframework.web.servlet.config.annotation.*;@Configurationpublic class SpringbootdemoAppConfigurer implements WebMvcConfigurer {@Autowiredprivate LoginInterceptor loginInterceptor;@Overridepublic void addInterceptors(InterceptorRegistry registry) {InterceptorRegistration registration = registry.addInterceptor(loginInterceptor);registration.addPathPatterns("/**");registration.excludePathPatterns("/*.html","/uploadimgs/*","/error","/api/login","/api/categorys","/api/goods*","/api/goods/*","/hello/*","/test/*");}}

View Code

注意我这里是拦截所有路径，然后使用excludePathPatterns来排除不需要拦截的路径，如果需要拦截的路径比较少，可以直接指定拦截的具体路径，这样就不用排除了。

4.4.4.另外补充一个功能点说明：一般一个应用程度都会有日志记录，这里也不能少，spring boot中默认实现了：slf4j+logback（slf4j是一个日志门面接口，logback是slf4j接口的实现，这样搭配比较好，可以随时更换日志实现框架），先在application.properties配置日志的基本参数，如下所示：(详细集成配置，可参见：/p/88b03b03570c)

#logging.config=xxxx #可以指定单独的日志配置XML文件，进行更丰富的设置，这里未采用logging.level.root=.zuowenjun.boot.mapper=debuglogging.file=springbootdemo.log

配置好后，然后在相应的类中直接使用即可，用法如下：（具体可见上面的GoodsServiceImpl代码）

private static Logger logger=LoggerFactory.getLogger(GoodsServiceImpl.class);//通过日志工厂获得一个日志记录实例logger.info("日志信息");//有多个日志级别可用，但注意需要配置中的root级别相对应，比如目前是配置了info，如果使用debug，可能就不会输出日志到文件

4.5效果展示：(全部采用HTML+AJAX静态交互)

通过以上的后端API代码+基于VUE的前端HTML，就完成了一个简单的电商物购DEMO，效果截图如下：

主页：（加入购物车后，右上角的”购物车(已加入商品数量：0)“数字变自动同步更新）

商品详情：

购物车：

订单管理：

后台管理（商品管理）：

添加商品后，自动加入到列表第一行，如果删除则移除删除的商品所在行

本文示例项目源码，请参见GIT:/zuowj/springbootdemo

JAVA WEB快速入门之从编写一个基于SpringBoot+Mybatis快速创建的REST API项目了解SpringBoot SpringMVC REST API Mybatis等相关知识...

本内容不代表本网观点和政治立场，如有侵犯你的权益请联系我们处理。

网友评论