学习资料

✧ Spring Boot 官方文档：https://docs.spring.io/spring-boot/docs/current/reference/html/

✧ 视频地址：

系统定制开发项目中的资料下载链接：（系统定制开发从黑马公众号获取到的系统定制开发最初状态的）

        系统定制开发因为该项目简单易上手，系统定制开发比较合适新手作为第一系统定制开发个实战项目。系统定制开发所以为了尽可能的规范，系统定制开发该篇的代码基本上与视系统定制开发频导师中命名与开发代码一致。系统定制开发尽可能的规范代码。

        系统定制开发该篇只是到实现了后台系统定制开发管理功能与移动端的功能的需求。基本上（除QQ系统定制开发邮箱验证登录）系统定制开发是黑马程序员吉瑞外卖系统定制开发上课的笔记。

系统定制开发这里只分享该篇文章需系统定制开发要用到的资料代码

链接：https://pan.baidu.com/s/1uQKb8Wt3MRU204pBJsU1XQ 
提取码：6660

系统定制开发后期会将我所作的笔记系统定制开发思维导图分享给大家以系统定制开发便大家复习。

目录

01-系统定制开发项目背景介绍

        本项目(瑞吉外卖)系统定制开发是专门为餐饮企业(餐厅、饭店)系统定制开发定制的一款软件产品,系统定制开发包括系统管理后台和移系统定制开发动端应用两部分。系统定制开发其中系统管理后台主要系统定制开发提供给餐饮企业内部员工使用,系统定制开发可以对餐厅的菜品、套餐、系统定制开发系统定制开发订单等进行管理维护。系统定制开发移动端应用主要提供给系统定制开发消费者使用,系统定制开发可以在线浏览菜品、系统定制开发系统定制开发添加购物车、下单等。

系统定制开发本项目共分为3系统定制开发期进行开发:

系统定制开发第一期主要实现基本需求，系统定制开发其中移动端应用通过H5实现，系统定制开发用户可以通过手机浏览器访问。

系统定制开发第二期主要针对移动端系统定制开发应用进行改进，系统定制开发使用微信小程序实现，系统定制开发用户使用起来更加方便。

系统定制开发第三期主要针对系统进系统定制开发行优化升级，系统定制开发提高系统的访问性能。

系统定制开发产品原型展示

        产品原型，系统定制开发就是一款产品成型之前系统定制开发的一个简单的框架,系统定制开发就是将页面的排版布局展现出来，系统定制开发使产品的初步构思有一系统定制开发个可视化的展示。系统定制开发通过原型展示,系统定制开发可以更加直观的了解项系统定制开发目的需求和提供的功能。

系统定制开发课程资料中已经提供了产品原型：

系统定制开发产品原型只是指项目有这个功能，系统定制开发而不是最终的项目效果。系统定制开发本项目可以在资料-->产品原型  中查看

技术选型

功能结构

系统定制开发角色即功能

        系统定制开发后台系统管理员：系统定制开发系统定制开发登录后台管理系统、系统定制开发拥有后台系统中的所有操作权限

        系统定制开发后台系统普通员工：登录后台管理系统，对菜品、套餐、订单等进行管理

        C端用户：系统定制开发登录移动端应用，系统定制开发可以浏览菜品、添加购物车、设置地址、在线下单

02-系统定制开发系统定制开发软件开发流程

软件开发流程

        需求分析：产品原型、系统定制开发需求规格说明书

        设计：产品文档、UI界面设计、概要设计、详细设计、系统定制开发数据库设计

        编码：项目代码、单元测试

        测试：测试用例、测试报告

        上线运难：系统定制开发软件环境安装、配置

角色分工

        项目经理：系统定制开发对整个项目负责,任务分配、把控进度

        产品经理：系统定制开发进行需求调研,系统定制开发输出需求调研文档、系统定制开发产品原型等

        UI设计师：系统定制开发根据产品原型输出界面效果图

        架构师：系统定制开发项目整体架构设计、系统定制开发技术选型等

        系统定制开发开发工程师：代码实现

        系统定制开发测试工程师：系统定制开发编写测试用例，系统定制开发输出测试报告

        系统定制开发运维工程师：系统定制开发软件环境搭建、项目上线

03-系统定制开发后台管理与移动端基础开发

基础配置

链接MySQL系统定制开发本地数据库：

MySQL -hlocalhost -u账号 -p密码

系统定制开发创建数据库reggie字符为utf8mb4：

mysql> create database reggie character set utf8mb4;

运行sql文件在1 系统定制开发瑞吉外卖项目-->资料-->数据模型-->db_reggie.sql;

系统定制开发使用客户端图形化界面系统定制开发运行或者使用命令行运行（系统定制开发命令行如下）：

mysql> source {路径}

创建MAVEN工程

        系统定制开发更换个人的MAVEN、检查JDK1.8（Setting-->Build-->Build Tools-->Maven-->Runner、Project Settings-->project--> SDK）

<?xml version="1.0" encoding="UTF-8"?>
<project xmlns="http://maven.apache.org/POM/4.0.0"
         xmlns:xsi="http://www.w3.org/2001/XMLSchema-instance"
         xsi:schemaLocation="http://maven.apache.org/POM/4.0.0 http://maven.apache.org/xsd/maven-4.0.0.xsd">
    <modelVersion>4.0.0</modelVersion>
    <parent>
        <groupId>org.springframework.boot</groupId>
        <artifactId>spring-boot-starter-parent</artifactId>
        <version>2.4.5</version>
        <relativePath/> <!-- lookup parent from repository -->
    </parent>
 
    <groupId>com.lxxd.reggie</groupId>
    <artifactId>reggie_lxxd</artifactId>
    <version>1.0-SNAPSHOT</version>
 
    <properties>
        <java.version>1.8</java.version>
    </properties>
    <dependencies>
 
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter</artifactId>
        </dependency>
 
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-test</artifactId>
            <scope>test</scope>
        </dependency>
 
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-web</artifactId>
            <scope>compile</scope>
        </dependency>
 
        <dependency>
            <groupId>com.baomidou</groupId>
            <artifactId>mybatis-plus-boot-starter</artifactId>
            <version>3.4.2</version>
        </dependency>
 
        <dependency>
            <groupId>org.projectlombok</groupId>
            <artifactId>lombok</artifactId>
            <version>1.18.20</version>
        </dependency>
 
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>fastjson</artifactId>
            <version>1.2.76</version>
        </dependency>
 
        <dependency>
            <groupId>commons-lang</groupId>
            <artifactId>commons-lang</artifactId>
            <version>2.6</version>
        </dependency>
 
        <dependency>
            <groupId>mysql</groupId>
            <artifactId>mysql-connector-java</artifactId>
            <scope>runtime</scope>
        </dependency>
 
        <dependency>
            <groupId>com.alibaba</groupId>
            <artifactId>druid-spring-boot-starter</artifactId>
            <version>1.1.23</version>
        </dependency>
 
        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-starter-mail</artifactId>
        </dependency>
 
    </dependencies>
 
    <build>
        <plugins>
            <plugin>
                <groupId>org.springframework.boot</groupId>
                <artifactId>spring-boot-maven-plugin</artifactId>
                <version>2.4.5</version>
            </plugin>
        </plugins>
    </build>
</project>

创建application.yml系统定制开发文件导入以下配置

server:
  port: 8080
spring:
  application:
    # 系统定制开发应用的名称
    name: reggie_take_out
  datasource:
    druid:
      driver-class-name: com.mysql.cj.jdbc.Driver
      url: jdbc:mysql://localhost:3306/reggie?serverTimezone=Asia/Shanghai&useUnicode=true&characterEncoding=utf-8&zeroDateTimeBehavior=convertToNull&useSSL=false&allowPublicKeyRetrieval=true
      username: ${username}
      password: ${password}
mybatis-plus:
  configuration:
    #系统定制开发在映射实体或者属性时，系统定制开发将数据库中表名和字段系统定制开发名中的下划线去掉，系统定制开发按照驼峰命名法映射
    map-underscore-to-camel-case: true
    log-impl: org.apache.ibatis.logging.stdout.StdOutImpl
  global-config:
    db-config:
      id-type: ASSIGN_ID

编写启动Main类

@SpringBootApplication
@Slf4j //开启日志
@ServletComponentScan
public class Main {
    public static void main(String[] args) {
        SpringApplication.run(Main.class,args);
        log.info("系统定制开发项目启动成功");
    }
}

系统定制开发即可启动成功！！！

系统定制开发打开项目资料中的前端资源文件backend、front导入到resources下如图：

        系统定制开发默认情况下resources映射static、templates其中static系统定制开发中放静态页面，而templates系统定制开发中放动态页面。系统定制开发未放该文件夹下，所以需要添加文件的映射；

config.WebMvcConfig

@Slf4j
@Configuration
public class WebMvcConfig extends WebMvcConfigurationSupport {
    /**
     * 设置静态资源映射
     * **/
    @Override
    protected void addResourceHandlers(ResourceHandlerRegistry registry){
        log.info("开启静态资源映射.....");
        registry.addResourceHandler("/backend/**").addResourceLocations("classpath:/backend/");
        registry.addResourceHandler("/front/**").addResourceLocations("classpath:/front/");
    }
}

        在启动类中加入@ServletComponentScan使配置类生效

        即可访问： 访问到该网址，项目环境搭建完成。

后端系统

登录功能

登录功能网站：

对应后台管理员表：employee

    登录功能处理逻辑如下:
     1、将页面提交的密码password进行 MD5 加密处理
     2、根据页面提交的用户名username查询数据库
     3、如果没有查询到数据，则返回登录失败的结果
     4、进行密码比对，如果不一致，则返回登录失败的结果
     5、查看员工状态，如果为 已禁用状态，则返回被禁用的结果信息
     6、登录成功，将员工id 存入Session并返回登录成功的结果

创建项目架构与基本类

entity

 
import com.baomidou.mybatisplus.annotation.FieldFill;
import com.baomidou.mybatisplus.annotation.TableField;
import lombok.Data;
import java.io.Serializable;
import java.time.LocalDateTime;
 
@Data
public class Employee implements Serializable {
 
    private static final long serialVersionUID = 1L;
 
    private Long id;
 
    private String username;
 
    private String name;
 
    private String password;
 
    private String phone;
 
    private String sex;
 
    private String idNumber;
 
    private Integer status;
 
    private LocalDateTime createTime;
 
    private LocalDateTime updateTime;
 
    @TableField(fill = FieldFill.INSERT)
    private Long createUser;
 
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private Long updateUser;
 
}
 

mapper

@Mapper
public interface EmployeeMapper extends BaseMapper<Employee> {
 
 
}

service

public interface EmployeeService extends IService<Employee> {
}

Service.impl

@Service
public class EmployeeServiceImpl extends ServiceImpl<EmployeeMapper, Employee> implements EmployeeService {
}

controller

@Slf4j
@RestController
@RequestMapping("/employee")
public class EmployeeController {
 
    @Autowired
    private EmployeeService employeeService;
}
 

common

封装返回结果类R；

import lombok.Data;
import java.util.HashMap;
import java.util.Map;
 
@Data
public class R<T> {
 
    private Integer code; //编码：1成功，0和其它数字为失败
 
    private String msg; //错误信息
 
    private T data; //数据
 
    private Map map = new HashMap(); //动态数据
 
    public static <T> R<T> success(T object) {
        R<T> r = new R<T>();
        r.data = object;
        r.code = 1;
        return r;
    }
 
    public static <T> R<T> error(String msg) {
        R r = new R();
        r.msg = msg;
        r.code = 0;
        return r;
    }
 
    public R<T> add(String key, Object value) {
        this.map.put(key, value);
        return this;
    }
 
}
 
 

⚝  请求URL地址：http://127.0.0.1:8080/employee/login

⚝  请求方式：post  

⚝  参数：username , password

controller.EmployeeController

 
/**
 * 员工登录
 * */
@PostMapping("/login")
public R<Employee> login(HttpServletRequest request, @RequestBody Employee employee){
  
 
    //1、将界面提交的密码password进行md5加密处理
    String password = employee.getPassword();
    password = DigestUtils.md5DigestAsHex(password.getBytes());  //解析成md5加密
 
    //2.根据页面提交用户名username查询数据库
    LambdaQueryWrapper<Employee> queryWrapper = new LambdaQueryWrapper<>();
    queryWrapper.eq(Employee::getUsername,employee.getUsername());
    Employee emp = employeeService.getOne(queryWrapper);   //获取数据库中唯一的数据，就是在索引中有Unique字段的数据
 
    //3.如果没有查询到则返回登录失败结果
    if(emp == null){
        return  R.error("用户名不存在");
    }
 
 
    //4、密码比对，如果不一致则返回登录失败结果
    if(!emp.getPassword().equals(password)){
        return R.error("用户名或密码错误");
 
    }
    // 5、查看员工状态，如果为已禁用状态，则返回员工已禁用结果
    if(emp.getStatus() == 0){
        return R.error("账号已禁用");
    }
 
 
   //6、登录成功，将员工id存入Session并返回登录成功结果
    request.getSession().setAttribute("employee",emp.getId());
    return R.success(emp);
}
 

访问地址：

可用账号：admin    ；默认密码：123456  进行登录测试；

F12-->Application-->Storage-->Local Storage中的userInfo可以查看已登录的id以及信息；

退出登录功能

当实现退出功能时：

1、我们应该清理session中的id  

2、并跳转界面来实现退出

登录后当我们点击右上角的退出按钮时，将会触发以下请求ajax请求：

⚝  请求URL地址：

⚝  请求方式：post

⚝  参数：无

//  退出功能实现
//  1、LocalStorage 清理Session中的用户id
//  2、返回结果
@PostMapping("/logout")
public R<String> logout(HttpServletRequest request){
    request.getSession().removeAttribute("employee");
    return R.success("退出成功");
}

此时可以查看到F12-->Application-->Storage-->Local Storage中的userInfo消失

完善登录功能 

        项目缺陷：如果用户不进行登陆，直接访问系统的首页，照样可以正常访问，这种设计是不合理的，我们希望看到的效果是只有完成了登陆后才可以访问系统中的页面，如果没有登陆则跳转到登陆页面；

前端拦截器如果msg返回为“NOTLOGIN”则跳回login.html界面

        使用过滤器或者是拦截器，在拦截器或者是过滤器中判断用户是否已经完成了登陆，这里使用过滤器。

创建过滤器：LoginCheckFilter

filter

 
 
/*
*检查用户是否已经完成登录
* **/
@WebFilter(filterName = "loginCheckFileter",urlPatterns = "/*") //拦截所有内容
@Slf4j
public class LoginCheckFilter implements Filter {
 
    //  路径匹配，支持通配符
    public static final AntPathMatcher PATH_MATCHER = new AntPathMatcher();
 
    @Override
    public void doFilter(ServletRequest servletRequest, ServletResponse servletResponse, FilterChain filterChain) throws IOException, ServletException {
       HttpServletRequest request = (HttpServletRequest)servletRequest; //强转为HttpServletRequest
        HttpServletResponse response = (HttpServletResponse)servletResponse;
        log.info("拦截到请求：{}",request.getRequestURI());
 
        //1.获取本次请求的URI
        String requestURI = request.getRequestURI();
 
        /*直接放行的URL*/
        String[] urls = new String[]{
                "/employee/login",
                "/employee/logout",
                "/backend/**",
                "/front/**",
 
        };
 
 
        // 2、判断本次请求是否需要处理
        boolean check = isMatch(urls, requestURI);
        // 3、如果不需要处理，直接放行
        if(check){
            log.info("本次请求{}不需要处理",requestURI);
            filterChain.doFilter(request,response);
            return;
        }
 
        // 4、判断登录状态(session是否含有employee的登录信息)，如果已经登录，则直接放行
        Long empId = (Long) request.getSession().getAttribute("employee");
        if (empId != null) {
            log.info("用户已登录，用户id为：{}",request.getSession().getAttribute("employee"));
        
            filterChain.doFilter(request,response);
            return;
        }
 
 
        //5.如果未登录则返回未登录结果，通过输出流的方式向客户端页面响应JSON格式数据
        response.getWriter().write(JSON.toJSONString(R.error("NOTLOGIN")));
        return;
 
 
    }
  //  路径匹配，检查本次请求是否需要放行
  public boolean isMatch(String[] urls,String requestURI){
      for (String url : urls) {
          boolean match = PATH_MATCHER.match(url, requestURI);
          if (match){
              return true;
          }
      }
      return false;
  }
}

在启动类加上注解@ServletComponentScan

        此时访问： 如果查看到该页面跳转至登录界面并且后台日志会打印拦截信息则过滤器配置成功！

新增员工

        将数据插入到employee表中，需要注意的是表中的username字段加入了唯一约束，因为username是员工登录账号必须是唯一的。

程序的执行过程:

1、页面发送ajax请求,将新增员工页面中输入的数据以json的形式提交到服务端

2、服务端Controller接收页面提交的数据并调用Service将数据进行保存

3、Service调用Mapper操作数据库，保存数据

F12-->Network-->employee中的信息可以查看到请求地址与请求方式以及携带参数等信息。

⚝  新增员工请求URL地址：http://localhost:8080/employee  

⚝  请求方式：post

⚝  参数：name，phone，sex，idNumber，username

controller.EmployeeController

//新增员工
@PostMapping
public R<String> save(HttpServletRequest request,@RequestBody Employee employee){
    log.info("新曾员工，员工信息：{}",employee.toString());
 
    //设置初始密码123456，需要进行md5加密处理
    employee.setPassword(DigestUtils.md5DigestAsHex("123456".getBytes()));
 
    //设置时间
    employee.setCreateTime(LocalDateTime.now());
    employee.setUpdateTime(LocalDateTime.now());
 
    //获的当前登录用户的id
    Long empId= (Long) request.getSession().getAttribute("employee");
    employee.setCreateUser(empId);
    employee.setUpdateUser(empId);
    employeeService.save(employee);
 
    return R.success("新增员工成功");
}
 

        此时到界面中添加员工可以看见，添加数据库没有username的员工信息已经可以成功保存数据库并调整界面。（跳转到的界面出错不用管，因为还没有弄员工页面的展示）

完善新增功能

        我们在Mysql中username设置为唯一索引，而代码中并没有对username是否重复进行判断。新增用户username在数据库中已经存在的字段的时候，就会出现异常，这个异常是MySQL数据库抛出来的。因此我们需要配置异常处理器专门来处理这个异常。

添加重复的账号则会报异常：java.sql.SQLIntegrityConstraintViolationException: Duplicate entry 'lxxd' for key 'employee.idx_username'

配置全局异常处理器GlobalExceptionHandler ：

filter

import lombok.extern.slf4j.Slf4j;
import org.springframework.stereotype.Controller;
import org.springframework.web.bind.annotation.ControllerAdvice;
import org.springframework.web.bind.annotation.ExceptionHandler;
import org.springframework.web.bind.annotation.ResponseBody;
import org.springframework.web.bind.annotation.RestController;
 
import java.sql.SQLIntegrityConstraintViolationException;
 
/**
 * 全局异常处理
 * */
@ControllerAdvice(annotations = {RestController.class, Controller.class})  //只要类上加了这两个处理器的就会被拦截
@ResponseBody
@Slf4j
public class GlobalExceptionHandler {
    /**
     * 进行异常处理 SQLIntegrityConstraintViolationException
     * */
    @ExceptionHandler(SQLIntegrityConstraintViolationException.class)
    public R<String> exceptionHandler(SQLIntegrityConstraintViolationException ex){
        log.error(ex.getMessage());
 
        //判断异常信息里面是否含有该关键字，做进一步处理
 
        if(ex.getMessage().contains("Duplicate entry")){
            String[] split = ex.getMessage().split(" ");  //以空格分割
            String msg = split[2] + "已存在";   
            return R.error(msg);
        }
        return R.error("未知错误！");
 
    }
 
}
 
 

        此时我们在登录后，添加一个重复的账号时可以看到。前端输出的错误信息，以及后端我们打印出的报错日志；

员工信息分页功能

        系统中的员工比较多的时候，如果在一个页面中全部展示出来会显得比较乱不便于查看，所以一般都系统中都会以分页的方式来展示列表数据。

程序的执行过程:

1、页面发送ajax请求,将分页查询参数(page, pageSize, name)提交到服务端

2、服务端Controller接收页面提交的数据并调用Service查询数据

3、Service调用Mapper操作数据库,查询分页数据

4、Controller将查询到的分页数据响应给页面

5、页面接收到分页数据并通过ElementUI的Table组件展示到页面上

配置MP的分页插件

config.MybatisPlusConfig

import com.baomidou.mybatisplus.extension.plugins.MybatisPlusInterceptor;
import com.baomidou.mybatisplus.extension.plugins.inner.PaginationInnerInterceptor;
import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
 
/*
 *   配置MP的分页插件
 * **/
@Configuration
public class MybatisPlusConfig {
 
 
    @Bean
    public MybatisPlusInterceptor mybatisPlusInterceptor(){
        MybatisPlusInterceptor mybatisPlusInterceptor = new MybatisPlusInterceptor();
        mybatisPlusInterceptor.addInnerInterceptor(new PaginationInnerInterceptor());
        return mybatisPlusInterceptor;
    }
 
 
}
 
 

当我们登录进index.html界面后。前端主动往后端发送请求获取列表数据。请求如下

默认请求发送中的page=1，pageSize=10

⚝  员工列表请求URL：http://localhost:8080/employee/page?page=1&pageSize=10

⚝  请求方式：GET

⚝  参数：page，pageSize

我们在查看搜索框中以搜索123时

 地址相同而携带的参数不同。刚进入页面时默认发的请求中并未携带name参数；只有使用搜索框搜索时才携带name参数。

⚝  请求URL：http://localhost:8080/employee/page

⚝  请求方式：GET

⚝  参数：page，pageSize，name

controller.EmployeeController

//分页查询
@GetMapping("/page")
public R<Page> page(int page, int pageSize,String name){
    log.info("page = {},pageSize = {} ,name={}",page,pageSize,name);
    //构造分页构造器
    Page pageInfo = new Page(page,pageSize);
 
    //构造条件构造器
    LambdaQueryWrapper<Employee> queryWrapper = new LambdaQueryWrapper();
 
    //条件过滤条件 name不为null，才会 比较 getUsername方法和前端传入的name是否匹配 的过滤条件
    queryWrapper.like(StringUtils.isNotEmpty(name),Employee::getUsername,name);
 
    //添加排序条件  根据用户的时间升序分页展示
    queryWrapper.orderByDesc(Employee::getUpdateTime);
 
    //执行查询
    employeeService.page(pageInfo,queryWrapper);
 
 
    //执行查询
    return R.success(pageInfo);
}
 

此时登录后我们可以正常查看员工的分页功能。并且能正常的使用搜索框搜索员工。

 启用/禁用员工账号

        在员工管理列表页面中，可以对某个员工账号进行启用或者是禁用操作。账号禁用的员工不能登陆系统，启用后的员工可以正常登陆；（后端传status由前端负责判定）

        只有管理员(admin用户)才可以对其他普通用户进行启用操作，禁用操作，所以普通用户登录系统后启用，禁用按钮不显示；（前端负责判定）

        并且如果某个员工账号的状态为正常，则按钮显示为’‘禁用’，如果员工账号状态为已禁用，则按钮显示为“启用”。（前端负责判定）

程序的执行过程:

1、页面发送ajax请求,将参数(id、status)提交到服务端

2、服务端Controller接收页面提交的数据并调用Service更新数据

3、Service调用Mapper操作数据库

账号正常：status=1；账号禁用：status=0；

⚝  启用/禁用请求URL：http://localhost:8080/employee    

⚝  请求方式：post        

⚝  参数：id ，status

controller.EmployeeController

@PutMapping
 public R<String> update1(HttpServletRequest request,@RequestBody Employee employee){
 
     log.info(employee.toString());
 
     Long empId = (Long) request.getSession().getAttribute("employee"); //获取浏览器info字段的id
     employee.setUpdateTime(LocalDateTime.now());
     employee.setUpdateUser(empId);
     employeeService.updateById(employee);
     return R.success("员工信息修改成功");
 }
 
 

        修改员工的状态，提示信息显示修改成功，但是我们去数据库查验证的时候，但数据库中的status字段未能发生变化。

        js精度只能到16位，后面两位为四舍五入。而代码中的长度为19位。所以我们可以看到最后的两位数为0。导致数据库根据id查询修改时未能发现该条数据。修改失败

解决方法

对象转换器JacksonObjectMapper

1)、提供对象转换器JacksonObjectMapper,基于Jackson进行Java对象到json数据的转换（资料中已经提供,直接复制到项目中使用）

2)、在WebMvcConfig配置类中扩展Spring mvc的消息转换器,在此消息转换器中使用提供的对象转换器进行Java对象到json数据的转换

common

import com.fasterxml.jackson.databind.DeserializationFeature;
import com.fasterxml.jackson.databind.ObjectMapper;
import com.fasterxml.jackson.databind.module.SimpleModule;
import com.fasterxml.jackson.databind.ser.std.ToStringSerializer;
import com.fasterxml.jackson.datatype.jsr310.deser.LocalDateDeserializer;
import com.fasterxml.jackson.datatype.jsr310.deser.LocalDateTimeDeserializer;
import com.fasterxml.jackson.datatype.jsr310.deser.LocalTimeDeserializer;
import com.fasterxml.jackson.datatype.jsr310.ser.LocalDateSerializer;
import com.fasterxml.jackson.datatype.jsr310.ser.LocalDateTimeSerializer;
import com.fasterxml.jackson.datatype.jsr310.ser.LocalTimeSerializer;
import java.math.BigInteger;
import java.time.LocalDate;
import java.time.LocalDateTime;
import java.time.LocalTime;
import java.time.format.DateTimeFormatter;
import static com.fasterxml.jackson.databind.DeserializationFeature.FAIL_ON_UNKNOWN_PROPERTIES;
 
/**
 * 对象映射器:基于jackson将Java对象转为json，或者将json转为Java对象
 * 将JSON解析为Java对象的过程称为 [从JSON反序列化Java对象]
 * 从Java对象生成JSON的过程称为 [序列化Java对象到JSON]
 */
public class JacksonObjectMapper extends ObjectMapper {
 
    public static final String DEFAULT_DATE_FORMAT = "yyyy-MM-dd";
    public static final String DEFAULT_DATE_TIME_FORMAT = "yyyy-MM-dd HH:mm:ss";
    public static final String DEFAULT_TIME_FORMAT = "HH:mm:ss";
 
    public JacksonObjectMapper() {
        super();
        //收到未知属性时不报异常
        this.configure(FAIL_ON_UNKNOWN_PROPERTIES, false);
 
        //反序列化时，属性不存在的兼容处理
        this.getDeserializationConfig().withoutFeatures(DeserializationFeature.FAIL_ON_UNKNOWN_PROPERTIES);
 
 
        SimpleModule simpleModule = new SimpleModule()
                .addDeserializer(LocalDateTime.class, new LocalDateTimeDeserializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_TIME_FORMAT)))
                .addDeserializer(LocalDate.class, new LocalDateDeserializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_FORMAT)))
                .addDeserializer(LocalTime.class, new LocalTimeDeserializer(DateTimeFormatter.ofPattern(DEFAULT_TIME_FORMAT)))
 
                .addSerializer(BigInteger.class, ToStringSerializer.instance)
                .addSerializer(Long.class, ToStringSerializer.instance)
                .addSerializer(LocalDateTime.class, new LocalDateTimeSerializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_TIME_FORMAT)))
                .addSerializer(LocalDate.class, new LocalDateSerializer(DateTimeFormatter.ofPattern(DEFAULT_DATE_FORMAT)))
                .addSerializer(LocalTime.class, new LocalTimeSerializer(DateTimeFormatter.ofPattern(DEFAULT_TIME_FORMAT)));
 
        //注册功能模块 例如，可以添加自定义序列化器和反序列化器
        this.registerModule(simpleModule);
    }
}
 
 

在config.webMvcConfig中扩展我们的mvc框架的消息转换器

config.WebMavcConfig

 
    //  扩展SpringMvc的消息转换器
    @Override
    protected void extendMessageConverters(List<HttpMessageConverter<?>> converters) {
        log.info("自定义消息转化器 被调用!");
        // 创建消息转换器对象
        MappingJackson2HttpMessageConverter messageConverter = new MappingJackson2HttpMessageConverter();
        // 设置对象转换器，底层使用JackSON 将Java对象转化为JSON
        messageConverter.setObjectMapper(new JacksonObjectMapper());
 
        // 将上面的消息转换器对象追加到SpringMVC的 转换器容器 的第一个位置,优先采用下标为 0 位置的消息转换器
        converters.add(0,messageConverter);
    }
 

        启用与禁用员工账号这个功能，操作更新成功，并且数据库修改成功，页面的禁用和启动按钮也能正常转换；

员工信息编辑

        在员工管理中点击编辑按钮，跳转编辑界面并回显员工信息并进行修改，点击保存按钮完成编辑操作。当浏览器请求用户时会携带请求的id参数我们根据id参数返回对应的数据信息。返回类型的Json数据。

程序的执行流程:

1、点击编辑按钮时，页面跳转到add.html,并在url中携带参数[员工id]

2、在add.html页面获取url中的参数[员工id]

3、发送ajax请求,请求服务端，同时提交员工id参数

4、服务端接收请求,根据员工id查询员工信息,将员工信息以json形式响应给页面

5、页面接收服务端响应的json数据，通过VUE的数据绑定进行员工信息回显

6、点击保存按钮,发送ajax请求，将页面中的员工信息以json方式提交给服务端

7、服务端接收员工信息，并进行处理,完成后给页面响应

8、页面接收到服务端响应信息后进行相应处理

保存则会调用前面已经写过的新增员工方法（save）。

使用@PathVariable 用于绑定 url 中的占位符。例如：请求 url 中 /delete/{id}，这个{id}就是 url 占位符。（相当于他可以获得路径上指定{*}里面的字符串）

⚝  请求URL: http://localhost:8080/employee/{id}    

⚝  请求方式：GET

⚝  参数：id

//根据id查询员工信息
@GetMapping("/{id}")
public R<Employee> qq(@PathVariable Long id){
    log.info("根据id查询员工信息：id = {}"+String.valueOf(id));
    Employee employee =employeeService.getById(id);
    if(employee != null){
        return R.success(employee);
    }
    return R.error("没有查到对应员工信息");
}

        此时我们点击员工信息保存时就可以看见数据能够正常的回显到我们的编辑界面。并且我们修改新的信息后能够正常保存到数据库中。

公共字段自动填充

        后台系统的员工管理功能开发,在新增员工时需要设置创建时间、创建人、修改时间、修改人等字段,在编辑员工时需要设置修改时间和修改人等字段。这些字段属于公共字段,也就是很多表中都有这些字段。

Mybatis Plus公共字段自动填充,也就是在插入或者更新的时候为指定字段赋予指定的值,使用它的好处就是可以统一对这些字段进行处理,避免了重复代码。

实现步骤:
        1、在实体类的属性上加入@TableField注解,指定自动填充的策略
        2、按照框架要求编写元数据对象处理器,在此类中统一为公共字段赋值,此类需MetaObjectHandler接口

在需要插入的字段是添加@TableField注解；如下

entity.Employee

 
@TableField(fill = FieldFill.INSERT)  //插入时更新
private LocalDateTime createTime;
 
@TableField(fill = FieldFill.INSERT_UPDATE)   //插入和更新时填充字段
private LocalDateTime updateTime;
 
@TableField(fill = FieldFill.INSERT)
private Long createUser;
 
@TableField(fill = FieldFill.INSERT_UPDATE)
private Long updateUser;

2、实现接口MetaObjectHandler

设置一个MetaObjectHandler类为公共字段提供赋值如下

common

(只能获取到时间的插入填充，未能获取到插入人信息的自动填充)

import com.baomidou.mybatisplus.core.handlers.MetaObjectHandler;
import com.sun.prism.impl.BaseContext;
import lombok.extern.slf4j.Slf4j;
import org.apache.ibatis.reflection.MetaObject;
import org.springframework.stereotype.Component;
 
import java.time.LocalDateTime;
 
@Slf4j
@Component
public class MyMetaObjectHandler implements MetaObjectHandler {
 
    /**
     * 插入的时候自动填充
     * **/
    @Override
    public void insertFill(MetaObject metaObject) {
        log.info("公共字段自动填充[insert]....");
 
        /**给相应的属性赋值**/
        metaObject.setValue("createTime", LocalDateTime.now());
        metaObject.setValue("updateTime", LocalDateTime.now());
 
        metaObject.setValue("createUser",new Long(1));
        metaObject.setValue("updateUser",new Long(1));
    }
 
 
    /***
     * 更新的时自动填充
     * **/
    @Override
    public void updateFill(MetaObject metaObject) {
        log.info("公共字段自动填充[update]....");
 
        metaObject.setValue("updateTime", LocalDateTime.now());
        metaObject.setValue("updateUser",new Long(1));
 
    }
}
 
 

        将EmployeeController里面更新插入时间与更新插入人的信息字段屏蔽。保证用的是MetaObjectHandler接口实现时间与插入人的更新。找到以下语句并屏蔽。如下：

controller.EmployeeController

//employee.setCreateTime(LocalDateTime.now()); 
//employee.setUpdateTime(LocalDateTime.now()); 
 
//employee.setCreateUser(empId);
//employee.setUpdateUser(empId);
 
//  employee.setUpdateTime(LocalDateTime.now());

此时我们可以看到 create_user字段与update_user字段与我们前面写的一致存入的是个“1”；

3、完善公共字段自动填充获取插入人信息

使用ThreadLocal方法

什么是ThreadLocal?
        ThreadLocat并不是一个Thread,而是Thread的局部变量。当使用ThreadLocal维护变量时,ThreadLocal为每个使用该变量的线程提供独立的变量副本,所以每一个线程都可以独立地改变自己的副本,而不会影响其它线程所对应的副本。ThreadLocal为每个线程提供单独一份存储空间,具有线程隔离的效果,只有在线程内才能获取到对应的值,线程外则不能访问。
 
ThreadLocal常用方法:
public void set(T value) 设置当前线程的线程局部变量的值
public T get()返回当前线程所对应的线程局部变量的值
        我们可以在LoginCheckFilter的doFilter方法中获取当前登录用户id,并调用ThreadLocal的set方法来设置当前线程的线程局部变量的值(用户id) ,然后在MyMetaObjectHandler的updateFill方法中调用ThreadLocal的get方法来获得当前线程所对应的线程局部变量的值(用户id)。

实现步骤：

1、编写BaseContext工具类,基于ThreadLocal封装的工具类

2、在LoginCheckFilter的Filter方法中调用BaseContext来设置当前登录用户的id

3、在MyMetaObjectHandler的方法中调用BaseContext获取登录用户的id

common

public class BaseContext {
    public static  ThreadLocal<Long> threadLocal = new ThreadLocal<>();
 
    /**
     * 设置值
     * */
    public static void setCurrentId(Long id){
        threadLocal.set(id);
    }
 
    /**
     * 获取值
     * */
    public static Long getCurrentId(){
        return threadLocal.get();
    }
 
}

在过滤器Filter.LoginCheckFilter中设置threadLocal值、来设置当前登录用户的id

 
...............................
 
// 4、判断登录状态(session是否含有employee的登录信息)，如果已经登录，则直接放行
Long empId = (Long) request.getSession().getAttribute("employee");
if (empId != null) {
    log.info("用户已登录，用户id为：{}",request.getSession().getAttribute("employee"));
 
******************************************
    BaseContext.setCurrentId(empId);
 
******************************************
 
    filterChain.doFilter(request,response);
return;
 
}
..............................

就可以在common.MyMetaObjectHandler通过get设置值、来获取当前登录用户的id

   @Override
    public void insertFill(MetaObject metaObject) {
        log.info("公共字段自动填充[insert]....");
 
        /**给相应的属性赋值**/
        metaObject.setValue("createTime", LocalDateTime.now());
        metaObject.setValue("updateTime", LocalDateTime.now());
 
**************************************************
        metaObject.setValue("createUser",BaseContext.getCurrentId());
        metaObject.setValue("updateUser",BaseContext.getCurrentId());
**************************************************
    }
 
    /***
     * 更新的时自动填充
     * **/
    @Override
    public void updateFill(MetaObject metaObject) {
        log.info("公共字段自动填充[update]....");
 
        metaObject.setValue("updateTime", LocalDateTime.now());
********************************************
        metaObject.setValue("updateUser", BaseContext.getCurrentId());
********************************************
 
    }

        注意这里不要用admin账号进行测试，因为admin账号的id本来就是“1”，看不出来是否成功更新了update_user字段。所以这里我使用了一个id不为1的账号编辑了另一个员工账号。可以看到update_user字段成功修改。

新增分类

        后台系统中可以管理分类信息，分类包括两种类型，分别是菜品分类和套餐分类。当我们在后台系统中添加菜品时需要选择一个菜品分类，当我们在后台系统中添加一个套餐时需要选择一个套餐分类，在移动端也会按照菜品分类和套餐分类来展示对应的菜品和套餐。

新增菜单对应的表：Category

准备工作

Mapper

import com.baomidou.mybatisplus.annotation.FieldFill;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import lombok.Data;
import lombok.Getter;
import lombok.Setter;
import java.io.Serializable;
import java.time.LocalDateTime;
 
/**
 * 分类
 */
@Data
public class Category implements Serializable {
 
    private static final long serialVersionUID = 1L;
 
    private Long id;
 
 
    //类型 1 菜品分类 2 套餐分类
    private Integer type;
 
 
    //分类名称
    private String name;
 
 
    //顺序
    private Integer sort;
 
 
    //创建时间
    @TableField(fill = FieldFill.INSERT)
    private LocalDateTime createTime;
 
 
    //更新时间
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private LocalDateTime updateTime;
 
 
    //创建人
    @TableField(fill = FieldFill.INSERT)
    private Long createUser;
 
 
    //修改人
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private Long updateUser;
 
 
    //是否删除
    private Integer isDeleted;
 
}
 
 

service

import com.baomidou.mybatisplus.extension.service.IService;
import com.lxxd.object.entity.Category;
 
public interface CategoryService extends IService<Category> {
}
 
 

service.Impl

@Service
public class CategoryServiceImpl extends ServiceImpl<CategoryMapper, Category> implements CategoryService {
   
}

CategoryController

mport org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
 
@RestController
@RequestMapping("/category")
public class CategoryController {
 
    @Autowired
    private CategoryService categoryService;
 
}

新增菜品分类业务代码编写

程序的执行过程:

1、页面(backend/page/category/list.html)发送ajax请求,将新增分类窗口输入的数据以json形式提交到服务端

2、服务端Controller接收页面提交的数据并调用Service将数据进行保存

3、Service调用Mapper操作数据库，保存数据

可以看到新增菜品分类和新增套餐分类请求的服务端地址和提交的json数据结构相同,所以服务端只需要提供一个方法统一处理即可。

新增菜品、套餐分类：

⚝ 请求URL：http://127.0.0.1:8080/category    

⚝ 请求方式：POST                          

⚝ 参数：name， type， sort                                  

⚝ 参数说明：type=1为菜品，type=2为套餐

//新增菜品
@PostMapping
public R<String> save(@RequestBody Category category){
    log.info("category ： {}",category);
    categoryService.save(category);
    return R.success("新增分类成功");
}

        此时添加菜品可以看到菜品添加成功。并存储到数据库中。

菜品分类管理分页查询

        将菜品的分类以分页的形式显示在页面中。

程序的执行过程:

1、页面发送ajax请求,将分页查询参数(page、pageSize)提交到服务端

2、服务端Controller接收页面提交的数据并调用Service查询数据

3、Service调用Mapper操作数据库,查询分页数据

4、Controller将查询到的分页数据响应给页面

5、页面接收到分页数据并通过ElementUI的Table组件展示到页面上

⚝ 请求URl：http://127.0.0.1:8080/category/page

⚝ 请求方式：GET            

⚝ 参数：page ，pageSize

//分页信息分页查询
@GetMapping("/page")
public R<Page> page(int page,int pageSize){
    //构造分页构造器
    Page<Category> pageInfo = new Page(page,pageSize);
 
    //构造条件构造器
    LambdaQueryWrapper<Category> queryWrapper = new LambdaQueryWrapper();
 
 
 
    //添加排序条件  根据Sort进行排序
    queryWrapper.orderByAsc(Category::getSort);
 
    //执行查询
    categoryService.page(pageInfo,queryWrapper);
 
    //执行查询
    return R.success(pageInfo);
}
 

        此时我们登录后，点击分类管理就可以看到我们的菜品分类信息了。

菜品分类删除

        在分类管理列表页面,可以对某个分类进行删除操作。需要注意的是当分类关联了菜品或者套餐时，此分类不允许删除。

⚝ 请求URL: http://127.0.0.1:8080/category        

⚝ 请求方式：DELETE                                            

⚝ 参数：ids

初步删除代码实现（该代码只是直接移除菜品分类。并没有对分类关联了菜品或者套餐进行判定后在删除）

@DeleteMapping
public R<String> delete(Long ids){
    log.info("删除分类 ，id为 ：{}",ids);
    categoryService.removeById(ids);
 
    return R.success("删除成功");
}

完善删除功能

        我们要对关联的菜品表与套餐表进行判定是否关联，使用我们要导入对应的菜品表（Dish）与套餐表（Setmeal）

要完善分类删除功能,需要先准备基础的类和接口:

1、实体类Dish和Setmeal (从课程资料中复制即可)

2、Mapper接口DishMapper和SetmealMapper

3、Service接口DishService和SetmealService

4、Servicec类DishServicelmpl和SetmealServicelmpl

导入实体类Dish和Setmeal并创建对应的接口：如下

entity

 
/**
 菜品
 */
@Data
public class Dish implements Serializable {
 
    private static final long serialVersionUID = 1L;
 
    private Long id;
 
 
    //菜品名称
    private String name;
 
 
    //菜品分类id
    private Long categoryId;
 
 
    //菜品价格
    private BigDecimal price;
 
 
    //商品码
    private String code;
 
 
    //图片
    private String image;
 
 
    //描述信息
    private String description;
 
 
    //0 停售 1 起售
    private Integer status;
 
 
    //顺序
    private Integer sort;
 
 
    @TableField(fill = FieldFill.INSERT)
    private LocalDateTime createTime;
 
 
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private LocalDateTime updateTime;
 
 
    @TableField(fill = FieldFill.INSERT)
    private Long createUser;
 
 
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private Long updateUser;
 
 
    //是否删除
    private Integer isDeleted;
 
}

Mapper

@Mapper
public interface DishMapper extends BaseMapper<Dish> {
}

service

public interface DishService extends IService<Dish> {
 
 
}

DishServiceImpl

@Service
@Slf4j
public class DishServiceImpl extends ServiceImpl<DishMapper, Dish> implements DishService {
 
}

entity

@Data
public class Setmeal implements Serializable {
 
    private static final long serialVersionUID = 1L;
 
    private Long id;
 
 
    //分类id
    private Long categoryId;
 
 
    //套餐名称
    private String name;
 
 
    //套餐价格
    private BigDecimal price;
 
 
    //状态 0:停用 1:启用
    private Integer status;
 
 
    //编码
    private String code;
 
 
    //描述信息
    private String description;
 
 
    //图片
    private String image;
 
 
    @TableField(fill = FieldFill.INSERT)
    private LocalDateTime createTime;
 
 
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private LocalDateTime updateTime;
 
 
    @TableField(fill = FieldFill.INSERT)
    private Long createUser;
 
 
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private Long updateUser;
 
 
    //是否删除
    private Integer isDeleted;
}

mapper

@Mapper
public interface SetmealMapper extends BaseMapper<Setmeal> {
}

service

public interface SetmealService extends IService<Setmeal> {
 
 
}

 SetmealServiceImpl

@Service
@Slf4j
public class SetmealServiceImpl extends ServiceImpl<SetmealMapper, Setmeal> implements SetmealService {
    
}

        CategoryService中自定义remove方法并编写对应的方法实现类来对我们来实现我们业务的逻辑处理。

service.CategoryService

public void remove(Long ids);

CategoryServiceImpl

 
@Autowired
private SetmealService setmealService;
 
@Autowired
private DishService dishService;
 
 
 
/**
 * 根据id删除分类，删除之前需要进行判断
 *
 * **/
@Override
public void remove(Long ids) {
 
    LambdaQueryWrapper<Dish> dishLambdaQueryWrapper = new LambdaQueryWrapper<>();
    //添加查询条件，根据分类id进行查询
    dishLambdaQueryWrapper.eq(Dish::getCategoryId,ids);
    int count1 = dishService.count(dishLambdaQueryWrapper);
 
    //查询当前分类是否关联了菜品，如果已经关联，抛出一个业务异常
    if(count1 > 0){
        //已经关联菜品，抛出一个业务异常
    }
 
 
 
    //查询当前分类是否关联了套餐，如果已经关联，抛出一个业务异常
    LambdaQueryWrapper<Setmeal> setmealLambdaQueryWrapper = new LambdaQueryWrapper<>();
    //添加查询条件，根据分类id进行查询
    setmealLambdaQueryWrapper.eq(Setmeal::getCategoryId,ids);
    int count2 = setmealService.count(setmealLambdaQueryWrapper);
    if(count2 > 0){
        //已经关联套餐，抛出一个业务异常
    }
 
    //正常删除分类
    super.removeById(ids);
}
 

        当我们查询当前分类是否关联了菜品或套餐时，如果已经关联。我们抛出一个业务异常来提示删除失败。

创建自定义异常类

common

/**
 * 自定义异常类
 * */
public class CustomException extends RuntimeException{
    public CustomException(String message){
        super(message);
    }
}

调用自定义业务异常

CategoryServicelmpl

........................................
//查询当前分类是否关联了菜品，如果已经关联，抛出一个业务异常
if(count1 > 0){
    //已经关联菜品，抛出一个业务异常
****************************************
    throw new CustomException("当前分类下关联了菜品，不能删除");
******************************************
}
.......
.....................................
if(count2 > 0){
    //已经关联套餐，抛出一个业务异常
*************************************************
    throw new CustomException("当前分类下关联了套餐，不能删除");
******************************************************
}
 
.....................................

在前面配置的全局异常处理器中捕获改异常并处理异常

common.GlobalExceptionHandler

 /**
     * 菜品异常处理  自定义CustomException
     * */
    @ExceptionHandler(CustomException.class)
    public R<String> exceptionHandler1(CustomException ex){
        log.error(ex.getMessage());
 
 
        return R.error(ex.getMessage());
 
    } 

将CategoryController里的方法修改成写的业务代码

controller.CategoryController

   @DeleteMapping
    public R<String> delete(Long ids){
        log.info("删除分类 ，id为 ：{}",ids);
****************************************
        categoryService.remove(ids);
****************************************
        return R.success("删除成功");
    }

        删除功能完善完成，此时在分类管理中，已关联菜品或者已关联套餐的分类已经不能被删除。

菜品分类修改

        在分类管理列表页面点击修改按钮，弹出修改窗口,在修改窗口回显分类信息并进行修改，最后点击确定按钮完成修改操作。

这里是由前端做了数据回显功能，后端不在做数据回显功能

前端已写  如图：

⚝ 请求URL: http://127.0.0.1:8080/category      

⚝ 请求方式：PUT        

⚝ 参数：id， name， sort

controller.CategoryController

//根据id修改菜品信息
@PutMapping
public R<String> update(@RequestBody Category category){
    log.info("修改分类信息");
    //修改数据  注意：updatetime与updateUser需要在实体类中添加@TableField使其自动填充
    categoryService.updateById(category);
 
    return R.success("修改分类信息成功");
}

然后我们就可以启动测试菜品分类的修改信息功能，并查看数据库中的信息被同步修改。

文件的上传下载

文件的上传介绍

文件上传下载黑马程序www.itheima.文件上传介绍文件上传,也称为upload,是指将本地图片、视频、音频等文件上传到服务器上,可以供其他用户浏览或下载的过程。文件上传在项目中应用非常广泛,我们经常发微博、发微信朋友圈都用到了文件上传功能。文件上传时,对页面的form表单有如下要求:

method="post"    采用post方式提交数据.

enctype="multipart/form-data"   采用multipart格式上传文件

type="file"   使用input的file控件上传

举例:

<form method="post" action="/common/upload" enctype="multipart/form-data">

<input name="myFile" type="/>

<input type="submit" value="提交" />

</form>

服务端接收介绍

文件上传介绍服务端要接收客户端页面上传的文件,通常都会使用Apache的两个组:
commons-fileupload
commons-io
Spring框架在spring-web包中对文件上传进行了封装,大大简化了服务端代码,我们只需要在Controller的方法中声明一个MultipartFile类型的参数即可接收上传的文件,例如:

文件下载介绍

文件下载介绍文件下载,也称为download,是指将文件从服务器传输到本地计算机的过程。
通过浏览器进行文件下载,通常有两种表现形式:
    以附件形式下载,弹出保存对话框,将文件保存到指定磁盘目录.
    直接在浏览器中打开通
 
过浏览器进行文件下载,本质上就是服务端将文件以流的形式写回浏览器的过程。

文件上传

        将文件上传下载界面文件夹中的upload.html导入到工程目录resources/backend/page/demo下如图：

        这是一个测试界面，为了方便我们测试我们在过滤器中配置拦截界面不拦截此界面，以便方便我们测试文件上传与下载功能。

filter.LoginCheckFilter

/*直接放行的URL*/
String[] urls = new String[]{
     ..................
.......................
..................
********************
        "/common/**"
*******************
};

⚝ 请求URL：http://127.0.0.1:8080/common/upload                

⚝ 请求方式：POST      

⚝ 参数：file        

controller

@RestController
@RequestMapping("/common")
@Slf4j
public class CommonController {
    /**
     * 文件上传
     * **/
 
    @PostMapping("/upload")
    public R<String> upload(MultipartFile file){
        //file是一个临时文件,需要转存到指定位置，否则本次请求完成后临时文件会被删除
        log.info(file.toString());
        try {
            file.transferTo(new File("D:\\hello.jpg"));   //文件的目录
        } catch (IOException e) {
            throw new RuntimeException(e);
        }
        return null;
    }
}

此时我们访问网站：

上传一张照片后可以看到我们在对应的D盘目录下就会产生一张hello.jpg照片。

完善功能

        在application.yml文件中指定好保存图片的目录。

lxxd:
  path: E:\img\

完善controller.CommonController

controller

import lombok.extern.slf4j.Slf4j;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
 
import java.io.File;
import java.io.IOException;
import java.util.UUID;
 
@RestController
@RequestMapping("/common")
@Slf4j
public class CommonController {
    /**
     * 文件上传
     * **/
    @Value("${lxxd.path}")
    private String basePath;
 
    @PostMapping("/upload")
    public R<String> upload(MultipartFile file){
        //file是一个临时文件,需要转存到指定位置，否则本次请求完成后临时文件会被删除
        //upload方法名中的参数名 必须是file（文件上传表单的 中name属性值必须是file,name="file"）
        log.info("上传的文件为: "+file.toString());
 
        //原始文件名
        String originalFilename = file.getOriginalFilename();  //abc.jpg
        //截取原始文件名的后缀（使用UUID+原始文件名的后缀以防上传文件名重复）
        String suffix = originalFilename.substring(originalFilename.lastIndexOf("."));  // suffix = .jpg  截取是带点的后缀
 
        // 使用UUID重新生成文件名，防止文件名重复，造成后面上传的文件覆盖前面上传的文件
        String fileName = UUID.randomUUID().toString()+suffix; //随机生成的30多位+后缀
 
        //创建一个目录对象
        File dir = new File(basePath);
        //判断当前目录是否存在
        if(!dir.exists()){
            //如果目录不存在则创建
            dir.mkdirs();
        }
 
        try {
            //将临时文件转存到指定位置
            file.transferTo(new File(basePath+fileName));
        } catch (IOException e) {
            throw new RuntimeException(e);
        }
       return R.success(fileName);
 
    }
}
 
 

文件下载

⚝ 请求URL：http://127.0.0.1:8080/common/download

⚝ 请求方式：GET                                                                

⚝ 参数：name    

controller.CommonController

//文件下载
@GetMapping("/download")
public void download(String name, HttpServletResponse response){
    try {
        //输入流，通过输入流读取文件内容
        FileInputStream fileInputStream = new FileInputStream(new File(basePath+name));
 
        //输出流,通过输出流将文件写回浏览器，在浏览器展示图片
        ServletOutputStream outputStream = response.getOutputStream();
 
        //设置一下为图片文件
        response.setContentType("image/jpeg");
 
        // 输入流读取到 内容放到 bytes数组中
        int len = 0;
        byte[] bytes = new byte[1024];
        while ((len = fileInputStream.read(bytes)) != -1){   //当为-1的时候输入流读取完成
            outputStream.write(bytes,0,len);          //写输入流到浏览器
            outputStream.flush();
        }
 
        //关闭资源
        outputStream.close();
        fileInputStream.close();
    } catch (Exception e) {
        throw new RuntimeException(e);
    }
}

        此时可以在网站：   中测试可以看到，图片上传后并回显到网页的图片展示框中。并且可以在上传图片存储的目录（E:\img\）内看到该图片。

新增菜品

        后台系统中可以管理菜品信息，通过新增功能来添加一个新的菜品，在添加菜品时需要选择当前菜品所属的菜品分类，并且需要上传菜品图片，在移动端会按照菜品分类来展示对应的菜品信息。

        新增菜品，其实就是将新增页面录入的菜品信息插入到dish表，如果添加了口味做法，还需要向dish_flavor表插入数据。所以在新增菜品时，涉及到两个表:

对应的菜品表：dish

对应的菜品口味表：dish_flavor

准备工作

在开发业务功能前,先将需要用到的类和接口基本结构创建好:

实体类DishFlavor (直接从课程资料中导入即可,

Dish实体前面课程中已经导入过了)

Mapper接口 DishFlavorMapper

业务层接口DishFlavorService

业务层实现类DishFlavorServicelmpl

控制层DishController

entity

import com.baomidou.mybatisplus.annotation.FieldFill;
import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import lombok.Data;
import java.io.Serializable;
import java.time.LocalDateTime;
 
/**
菜品口味
 */
@Data
public class DishFlavor implements Serializable {
 
    private static final long serialVersionUID = 1L;
 
    private Long id;
 
 
    //菜品id
    private Long dishId;
 
 
    //口味名称
    private String name;
 
 
    //口味数据list
    private String value;
 
 
    @TableField(fill = FieldFill.INSERT)
    private LocalDateTime createTime;
 
 
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private LocalDateTime updateTime;
 
 
    @TableField(fill = FieldFill.INSERT)
    private Long createUser;
 
 
    @TableField(fill = FieldFill.INSERT_UPDATE)
    private Long updateUser;
 
 
    //是否删除
    private Integer isDeleted;
 
}