笔记:SpringBoot+Vue全栈开发

笔记:SpringBoot+Vue全栈开发

        • 1. 开发环境热部署
        • 2. SpringBoot @RestController的使用
        • 3. SpringBoot实现文件上传
        • 4. 配置拦截器
        • 5. Restful服务+Swagger
        • 6. 使用MyBatis-Plus进行数据库操作
        • 7. 多表查询、条件查询及分页查询

1. 开发环境热部署

使用spring-boot-devtools组件,pom.xml文件中添加依赖,如下:

<dependency><groupId>org.springframework.boot</groupId><artifactId>spring-boot-devtools</artifactId><optional>true</optional>
</dependency>

在application.properties文件中添加如下配置

# 热部署生效
spring.devtools.restart.enabled=true
# 设置重启目录
spring.devtools.restart.additional-paths=src/main/java
# 设置classpath目录下的的web-inf文件夹内容修改不重启
spring.devtools.restart.exclude=static/**

IDEA还需要设置如下:Settings->Compiler->Build project automatically ,把这个选项勾上

在这里插入图片描述
之后还需按Ctrl+Shift+Alt+/快捷键调出Maintenance页面,单击Registry,勾选compiler.automake.allow.when.app.running复选框。
在这里插入图片描述
之后只需重启项目代码即可。
在这里插入图片描述

2. SpringBoot @RestController的使用
package com.liuze.demo.controller;import com.liuze.demo.entity.User;
import org.springframework.web.bind.annotation.*;@RestController
public class TestController {// http://localhost:8080/test1@GetMapping(value = "/test1")String test1(){return "test1";}// http://localhost:8080/test2?usr=liuze&pwd=123456@GetMapping(value = "/test2")String test2(String usr,String pwd){return "test2" + usr + "&" +pwd;}// http://localhost:8080/test3?username=liuze&password=123456@GetMapping(value = "/test3")String test3(@RequestParam(value = "username") String usr, @RequestParam(value = "password") String pwd){return "test3" + usr + "&" +pwd;}// http://localhost:8080/test4 参数在请求体中@PostMapping(value = "/test4")String test4(String usr,String pwd){return "test4" + usr +" &" + pwd;}// http://localhost:8080/test5 参数在请求体中@PostMapping(value = "/test5")String test5(User user){return "test5" + user;}// http://localhost:8080/test6 参数在json数据中@PostMapping(value = "/test6")String test6(@RequestBody User user){return "test6" + user;}}

其中post请求路径为test4,test5,test6。test4,test5,请求如下:
在这里插入图片描述
User为封装的User对象,有属性usr、pwd、类型均为String,需要提供get、set方法。

test6请求如下:
在这里插入图片描述

3. SpringBoot实现文件上传

Spring Boot限制了请求的文件大小,每个文件的配置最大为1MB,单次请求的文件的总数不能大于10MB。更改这个默认值在配置文件application.properties中添加这两个配置即可。

spring.servlet.multipart.max-file-size=10MB
spring.servlet.multipart.max-request-size=10MB

上传参照代码为:

package com.liuze.demo.controller;import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
import org.springframework.web.multipart.MultipartFile;
import java.io.File;
import java.io.IOException;@RestController
public class FileUpload {private final String SAVE_DIR = "E:/upolad/";@PostMapping(path = "/upload")public String fileUp(MultipartFile mfile) throws IOException {System.out.println(mfile.getContentType());// 获取文件类型System.out.println(mfile.getSize());// 获取文件大小saveFile(mfile);return "上传成功!";}private void saveFile(MultipartFile mFile) throws IOException {String filename = mFile.getOriginalFilename();// 获取文件原始名称System.out.println(filename);String path = SAVE_DIR + filename;File file = new File(path);mFile.transferTo(file);}}

运行结果:
在这里插入图片描述
出现报错,报错信息为The field mfile exceeds its maximum permitted size of 1048576 bytes.
这是因为上传的图片超过1MB导致的,把配置文件添加上述配置之后即可上传成功!
在这里插入图片描述
在这里插入图片描述
要想访问刚才上传的图片,还需要添加如下配置。

spring.web.resources.static-locations=file:E:/upolad/

在这里插入图片描述

4. 配置拦截器

也就是只有满足一定条件后,才能访问某些页面或接口。

package com.liuze.demo.interceptor;import org.springframework.web.servlet.HandlerInterceptor;import javax.servlet.http.HttpServletRequest;
import javax.servlet.http.HttpServletResponse;public class LoginInterceptor implements HandlerInterceptor {@Overridepublic boolean preHandle(HttpServletRequest request, HttpServletResponse response, Object handler) throws Exception {System.out.println("测试");return true;}
}

为了使这个拦截器生效,需要添加配置

package com.liuze.demo.config;import com.liuze.demo.interceptor.LoginInterceptor;
import org.springframework.context.annotation.Configuration;
import org.springframework.web.servlet.config.annotation.InterceptorRegistry;
import org.springframework.web.servlet.config.annotation.WebMvcConfigurer;@Configuration
public class WebConfig implements WebMvcConfigurer {@Overridepublic void addInterceptors(InterceptorRegistry registry) {registry.addInterceptor(new LoginInterceptor()).addPathPatterns("/test/**");}
}

表示只有访问路径中带有/test的才进入拦截器,访问http://localhost:8080/test1,控制台并没有打印测试字样,当把addPathPatterns去掉,表示拦截所有,此时再访问刚才那个接口,控制台会有打印。
请添加图片描述

5. Restful服务+Swagger

Restful风格接口比如:http://localhost:8080/user/1,http://localhost:8080/user/2等,请求的数据直接跟在请求接口后,与之前参数查询不同http://localhost:8080/user?useri=1

 @GetMapping(path = "/user/{id}")public String getUser(@PathVariable(value = "id") int id2){return "用户id:"+id2;}

在这里插入图片描述

另外就是使用了Get、Post、Put、Delete等请求方式,请求接口一样,但请求类型不一样,从而导致结果不一样。

Swagger是一个规范和完整的框架,用于生成、描述、调用和可视化Restful风格和web服务。需要添加的依赖为:

<dependency><groupId>io.springfox</groupId><artifactId>springfox-swagger2</artifactId><version>2.9.2</version>
</dependency><dependency><groupId>io.springfox</groupId><artifactId>springfox-swagger-ui</artifactId><version>2.9.2</version>
</dependency>
<!--        swagger-->

添加配置类如下:

package com.liuze.demo.config;import org.springframework.context.annotation.Bean;
import org.springframework.context.annotation.Configuration;
import springfox.documentation.builders.ApiInfoBuilder;
import springfox.documentation.builders.PathSelectors;
import springfox.documentation.builders.RequestHandlerSelectors;
import springfox.documentation.service.ApiInfo;
import springfox.documentation.spi.DocumentationType;
import springfox.documentation.spring.web.plugins.Docket;
import springfox.documentation.swagger2.annotations.EnableSwagger2;@Configuration
@EnableSwagger2 // 启用swagger2功能
public class SwaggerConfig {@Beanpublic Docket createRestApi(){return new Docket(DocumentationType.SWAGGER_2).apiInfo(apiInfo()).select().apis(RequestHandlerSelectors.basePackage("com"))  // 把com下的所有交给swagger进行管理.paths(PathSelectors.any()).build();}/*** api文档页面显示信息*/private ApiInfo apiInfo(){return new ApiInfoBuilder().title("api").description("演示使用").version("1.0").build();}}

访问页面http://localhost:8080/swagger-ui.html即可

在这里插入图片描述

出现的问题,springboot与swagger版本不兼容,当前使用的springboot版本为2.5.6,swagger版本为2.9.2。开始的springboot版本为2.7.12,启动springboot项目报错如下:
在这里插入图片描述
报错信息如下:
在这里插入图片描述
Failed to start bean ‘documentationPluginsBootstrapper’; nested exception is java.lang.NullPointerException
只需要在application.properties配置文件中添加如下配置即可

spring.mvc.pathmatch.matching-strategy=ant_path_matcher

其他解决方法可以参照这位大佬的文章:Failed to start bean ‘documentationPluginsBootstrapper‘; nested exception is java.lang.NullPointerEx

6. 使用MyBatis-Plus进行数据库操作

导入依赖

<dependency><groupId>com.baomidou</groupId><artifactId>mybatis-plus-boot-starter</artifactId><version>3.4.2</version>
</dependency>
<!--mybatis-plus依赖-->
<dependency><groupId>mysql</groupId><artifactId>mysql-connector-java</artifactId><version>5.1.47</version>
</dependency>
<!--mysql驱动--><dependency><groupId>com.alibaba</groupId><artifactId>druid-spring-boot-starter</artifactId><version>1.2.6</version>
</dependency>
<!--        druid-->

application.properties中添加如下配置

spring.datasource.type=com.alibaba.druid.pool.DruidDataSource
spring.datasource.driver-class-name=com.mysql.jdbc.Driver
spring.datasource.url=jdbc:mysql://localhost:3306/test_1?useSSL=false
spring.datasource.username=root
spring.datasource.password=root
mybatis-plus.configuration.log-impl=org.apache.ibatis.logging.stdout.StdOutImpl

在启动类上添加@MapperScan,如下:
在这里插入图片描述
使用直接在对于的mapper接口,让其继承BaseMapper接口

在这里插入图片描述
对应的控制类为:

package com.liuze.demo.controller;import com.liuze.demo.entity.User;
import com.liuze.demo.mapper.UserMapper;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.GetMapping;
import org.springframework.web.bind.annotation.PostMapping;
import org.springframework.web.bind.annotation.RestController;
import java.util.List;@RestController
public class UserController{@Autowiredprivate UserMapper um;// 查询所有的用户信息@GetMapping(path = "/users")public List<User> find(){List<User> users = um.selectList(null);System.out.println(users);return users;}@PostMapping(path = "/add")public int add(User user){int i = um.insert(user);System.out.println(user);return i;}}

访问接口:http://localhost:8080/users
在这里插入图片描述
添加用户:http://localhost:8080/add

在这里插入图片描述
数据库中的数据为:
在这里插入图片描述
因为数据库中字段与实体类的字段名不一致,所以在实体类User上添加了如下注解。@TableField

package com.liuze.demo.entity;import com.baomidou.mybatisplus.annotation.IdType;
import com.baomidou.mybatisplus.annotation.TableField;
import com.baomidou.mybatisplus.annotation.TableId;
import com.baomidou.mybatisplus.annotation.TableName;
import com.fasterxml.jackson.annotation.JsonProperty;
import lombok.AllArgsConstructor;
import lombok.Data;
import lombok.NoArgsConstructor;
import lombok.ToString;
import org.apache.ibatis.type.JdbcType;
import org.mapstruct.BeanMapping;
import org.springframework.context.annotation.Bean;@Data
@AllArgsConstructor
@NoArgsConstructor
@ToString
@TableName("user")
public class User {@TableId(value = "uid",type = IdType.AUTO)private Integer uid;@TableField("username")private String usr;@TableField("password")private String pwd;}
7. 多表查询、条件查询及分页查询

多表查询就不能用到mybatis-plus,mybatis-plus只是用单表条件查询。现在有一个用户表,一个用户可以有多个订单,为此有一个订单表,现在想查询所有用户数据,当然用户下的订单也需要查询得到。首先需要做的是在User实体类下添加属性List<Order> order,之后在UserMapper 下添加代码如下

package com.liuze.demo.mapper;import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.liuze.demo.entity.User;
import org.apache.ibatis.annotations.*;
import java.util.List;@Mapper
public interface UserMapper extends BaseMapper<User> {@Select("select * from user")@Results({@Result(column = "uid",property = "uid"),@Result(column = "username",property = "usr"),@Result(column = "password",property = "pwd"),@Result(column = "uid",property = "orders",javaType = List.class,many = @Many(select="com.liuze.demo.mapper.OrderMapper.findById"))})List<User> selectAll();@Select("select * from user where uid = #{uid}")List<User> selectById2(Integer uid);}

订单类Order拥有的属性有oid(订单号)、total(订单金额)、uid(用户编号),其对应的OrderMapper如下:

package com.liuze.demo.mapper;import com.baomidou.mybatisplus.core.mapper.BaseMapper;
import com.liuze.demo.entity.Order;
import com.liuze.demo.entity.User;
import org.apache.ibatis.annotations.*;
import java.util.List;@Mapper
public interface OrderMapper extends BaseMapper<Order> {@Select("select * from order1 where oid = #{uid}")List<Order> findById(int oid);@Select("select * from order1")@Results({@Result(column = "oid",property = "oid"),@Result(column = "total",property = "total"),@Result(column = "uid",property = "user",javaType = User.class,one = @One(select = "com.liuze.demo.mapper.UserMapper.selectById"))})List<Order> findAll();}

上述还有一个要求,通过一个订单,查看这个订单所属用户,因此在订单类下添加属性User。
运行结果:
在这里插入图片描述
这是所有用户信息,目前只有用户编号为1的用户拥有一条订单数据。
在这里插入图片描述
这是查询全部订单的结果,目前只有一条订单数据,数据里边拥有用户的信息(只是测试使用,数据随意造的)
条件查询需要使用QueryWrapper,把查询条件设置到这个对象里边即可

@GetMapping("/userByUsr/{usr}")public List<User> findByUsr(@PathVariable("usr") String username){QueryWrapper<User> wrapper = new QueryWrapper<>();wrapper.eq("username",username);return um.selectList(wrapper);}

在这里插入图片描述
分页查询需要添加配置类,如下:

package com.liuze.demo.config;import com.baomidou.mybatisplus.annotation.DbType;
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;@Configuration
public class MybatisPlusConfig {@Beanpublic MybatisPlusInterceptor pageInteceptor(){MybatisPlusInterceptor mybatisPlusInterceptor = new MybatisPlusInterceptor();PaginationInnerInterceptor paginationInnerInterceptor = new PaginationInnerInterceptor(DbType.MYSQL);mybatisPlusInterceptor.addInnerInterceptor(paginationInnerInterceptor);return mybatisPlusInterceptor;}}

所对应的控制类为:

@GetMapping("/userByPage/{page}/{limitSize}")
public IPage<User> findByPage(@PathVariable("page") Integer page, @PathVariable Integer limitSize){System.out.println(page+" "+limitSize);Page<User> page1 = new Page<User>(page,limitSize);return um.selectPage(page1,null);
}

运行结果:
在这里插入图片描述

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.mzph.cn/pingmian/41058.shtml

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈email:809451989@qq.com,一经查实,立即删除!

相关文章

opencv第一课-cnblog

opencv第一课 创建窗口 import timeimport cv2 #创建窗口 cv2.namedWindow(window,cv2.WINDOW_NORMAL)#cv2.WINDOW_AUTOSIZE自动大小&#xff0c;不允许修改窗口大小#更改窗口的大小 cv2.resizeWindow(window,800,600)#展示名字为window的窗口 cv2.imshow(window,0)key cv2.w…

vue中如何使用echarts和echarts-gl实现三维折线图和三维柱状图

一、vue中使用三维折线图 效果图&#xff1a; 二、使用步骤 1.引入库 安装echarts 在package.json文件中添加 "dependencies": {"echarts": "^5.1.2""echarts-gl": "^1.1.1",// "echarts-gl": "^2.0.8…

『古籍自有答案』古风H5案例赏析

「古籍自有答案」&#xff0c;一部由新京报与字节跳动公益联合打造的古风H5&#xff0c;以诗意盎然的开篇引领用户穿梭于千年文脉。 part1. 创意定位 "人生有惑问先贤&#xff0c;先贤答案存古籍"&#xff0c;在这里&#xff0c;每一个灵魂的探问&#xff0c;都能在…

拥抱 AGI:PieDataCS 引领云原生数据计算系统新范式

自2023年后&#xff0c;人工智能技术进入了一个更为成熟和广泛应用的阶段&#xff0c;人工通用智能&#xff08;AGI&#xff09;这一概念也成为了科技界和产业界热议的焦点。本文将结合 AGI 时代背景&#xff0c;从架构设计到落地实践&#xff0c;详细介绍拓数派云原生数据计算…

中职院校专业群的生成机制研究

摘要&#xff1a; 随着国内产业升级转型步伐的加快和职业教育质量提升的要求&#xff0c;中等职业院校&#xff08;中职院校&#xff09;的专业群建设成为促进教育与产业深度融合、实现内涵式发展的关键。本文采用案例分析法&#xff0c;探讨中职院校专业群生成机制&#xff0c…

Linux手动安装JDK1.8

1、下载要安装的jdk安装包文件 官网下载地址&#xff1a;https://www.oracle.com/cn/java/technologies/downloads/ 2、上传jdk安装包至要安装服务器 3、在要安装jdk位置使用命令解压安装包 安装路径: /usr/local/java 解压安装包&#xff0c;解压命令 tar -zxvf /install…

前端面试项目细节重难点(十)(已工作|做分享)

面试官&#xff1a;现场出需求&#xff1a;我想让一个左侧盒子可以进行拉伸、缩小、展示或隐藏这些功能&#xff0c;你会如何实现&#xff1f; 答&#xff1a;&#xff08;1&#xff09;分析问题&#xff1a;其实&#xff0c;我听到这个问题后&#xff1a; 我的第一种想法&am…

Linux关于文件的高级命令

tree命令 tree命令用于以树状图的形式显示目录结构。它可以帮助用户快速了解目录和文件的层次关系&#xff0c;非常适合用于浏览和理解大型文件系统的结构。 基础用法 显示当前目录的树状结构&#xff1a;tree 显示指定目录的树状结构&#xff1a;tree 指定目录路径 tree命…

基于FreeRTOS+STM32CubeMX+LCD1602+AD5621(SPI接口)的DAC控制输出Proteus仿真

一、仿真原理图: 二、运行效果: 三、STM32CubeMX配置: 1)、GPIO配置: 2)、freertos配置: 四、软件部分: 1)、main主函数: /* USER CODE BEGIN Header */ /** ****************************************************************************** * @file …

模拟5亿年自然进化史,全新蛋白质大模型ESM3诞生!前Meta老将力作LeCun转赞

模拟5亿年自然进化史&#xff0c;全新蛋白质大模型ESM3诞生&#xff01;前Meta老将力作LeCun转赞。 能抗衡AlphaFold 3的生命科学大模型终于出现了。初创公司Evolutionary Scale AI发布了他们最新的98B参数蛋白质语言模型ESM3。不仅支持序列、结构、功能的all-to-all推理&#…

【动态规划】动态规划一

动态规划一 1.第 N 个泰波那契数2.面试题 08.01. 三步问题3.使用最小花费爬楼梯4.解码方法 点赞&#x1f44d;&#x1f44d;收藏&#x1f31f;&#x1f31f;关注&#x1f496;&#x1f496; 你的支持是对我最大的鼓励&#xff0c;我们一起努力吧!&#x1f603;&#x1f603; 1.…

[k8s生产系列]:k8s集群故障恢复,etcd数据不一致,kubernetes集群异常

文章目录 摘要1 背景说明2 故障排查2.1 查询docker与kubelet状态2.2 查看kubelet服务日志2.3 重启docker与kubelet服务2.3.1 首先kubelet启动起来了&#xff0c;但是报错master节点找不到2.3.2 查询kubernetes集群服务&#xff0c;发现etcd与kube-apiserver均启动异常 2.4 etcd…

【Pyhton】读取寄存器数据到MySQL数据库

目录 步骤 modsim32软件配置 Navicat for MySQL 代码实现 步骤 安装必要的库&#xff1a;确保安装了pymodbus和pymysql。 配置Modbus连接&#xff1a;设置Modbus从站的IP地址、端口&#xff08;对于TCP&#xff09;或串行通信参数&#xff08;对于RTU&#xff09;。 连接M…

公用对象池

什么是对象池&#xff1f; 对象池顾名思义就是存放对象的池子&#xff0c;主要是为了重复利用对象。将不用的对象扔进池子里&#xff0c;需要用的时候再从池子中取出来。这样的一套机制我们称为对象池。 为什么用对象池&#xff1f; 其实从定义我们就可以看出来&#xff0c;…

算法金 | 我最常用的两个数据可视化软件,强烈推荐

大侠幸会&#xff0c;在下全网同名「算法金」 0 基础转 AI 上岸&#xff0c;多个算法赛 Top 「日更万日&#xff0c;让更多人享受智能乐趣」 抱个拳&#xff0c;送个礼 预警&#xff1a;今天文章的描述可能会让你有点别扭&#xff1b;如感到不适&#xff0c;请及时停止 在我行…

MacOS 安装 mtr 网络检测工具

Install sudo brew install mtr sudo chown root $(which mtr) sudo chmod us $(which mtr) sudo chown root $(which mtr-packet) sudo chmod us $(which mtr-packet) Test mtr google.com

C# WPF 3D 数据孪生 系列六

数字孪生应用开发 应用开发中的布局需求 Grid基本使用 WPF 3D绘图 点云 系列五-CSDN博客 WPF UI 3D 多轴 机械臂 stl 模型UI交互-CSDN博客 WPF UI 3D 基本概念 点线三角面 相机对象 材质对象与贴图 3D地球 光源 变形处理 动作交互 辅助交互插件 系列三-CSDN博客 数字孪生 介…

015-GeoGebra基础篇-定点旋转物体、动态显示数值并显示运动轨迹

这可能是我能想到的最大概率可以被你搜索到的标题了&#xff0c;容我先喘口气~ 目录 一、成品展示二、涉及内容三、做图步骤&#xff08;1&#xff09;绘制三角形t&#xff08;2&#xff09;建立定点D&#xff08;3&#xff09;制作角度滑动条&#xff08;4&#xff09;图形绕点…

嵌入式Linux系统编程 — 6.7 实时信号

目录 1 什么是实时信号 2 sigqueue函数 3 sigpending()函数 1 什么是实时信号 等待信号集只是一个掩码&#xff0c;它并不追踪信号的发生次数。这意味着&#xff0c;如果相同的信号在被阻塞的状态下多次产生&#xff0c;它只会在信号集中被记录一次&#xff0c;并且在信号集…

Windows 下用MSYS2 环境为RP2040 编译MicroPython 固件

就是想试试看MSYS2 能兼容到什么地步。自己做了个RP2040 板子&#xff0c;用了4MB 的Flash&#xff0c;默认的Micropython 固件是2MB 的&#xff0c;所以只能自己编译固件。 编译环境 MSYS2 的安装方法、基本配置什么的我就不管了&#xff0c;到处都有文章介绍这个。只提一点…