你好,我是Qiuner. 为记录自己编程学习过程和帮助别人少走弯路而写博客 这是我的 github gitee
如果本篇文章帮到了你 不妨点个赞吧~ 我会很高兴的 😄 (^ ~ ^)
想看更多 那就点个关注吧 我会尽力带来有趣的内容
快速入门Web开发(下)
案列开发
部分详情见 文件 JavaWeb案列
- 没写去全,想知道全部就去看JavaWeb案列,一定要去看
限定请求方式
//方案一 @RequestMapping (value = "/depts",method = RequestMethod.GET)//限定请求方式为get //限定请求方式为get //不需要打出value,写路径后,直接写method=请求类型就好
//方案二 @GetMapping ("/depts") public Result list(){ log.info("查询全部部门数据"); return Result.success(); }
开发部门相应功能
基本的开发方式及查询所有部门
- 开发一个小的需求的时候,先看对接文档
比如,开发该需求,查询全部的部门数据先分析
- 接口文档中注明了请求类型和请求地址
理清以上后,开始写代码
代码要实现的是
这三件事情。但我们需要将其分在不同的文件夹及java文件中。
- 在dao层(mapper)中进行数据访问
- 在service层中进行逻辑处理
- 在controller层中接收请求,响应数据
- pojo是存放对象的地方,比如检验是否成功的Result
流程是这样的:前端发送请求之后先进入到controller中的部门表(因为对部门进行操作),而该项会调用service来获取数据,在service中调用了mapper接口中的方法来查询信息,而mapper会对数据库进行操作,并将信息封住在list集合当中,将数据返回给service然后返回给controller最后返回给前端
- 因为使用的是json格式,所以使用list集合
为什么没有创建相应对象却能够在几个不同的文件中互相调用,返回?
因为使用了依赖注入!
在 list()
方法中,通过调用 deptMapper.list()
来执行查询操作,并将查询结果作为方法的返回值。这里的 deptMapper.list()
就是调用 DeptMapper
接口的 list()
方法,从数据库中获取部门数据。
虽然代码中没有直接写出 DeptMapper
的调用,但通过依赖注入的方式,DeptMapper
实例已经被注入到了 deptMapper
字段中,可以在 list()
方法中通过 deptMapper
字段来调用 DeptMapper
的方法。
删除部门
@DeleteMapping("/depts/{id}") public Result delete(@PathVariable Integer id){ //使用以下写法可以,将{}替换成id log.info("删除部门数据:{}",id); List<Dept> deptList =deptService.delete(); return Result.success(deptList); }
@PathVariable
是一个Spring框架的注解,用于从URL路径中提取变量的值,并将其绑定到方法参数上。在你提供的代码中,
@PathVariable Integer id
表示使用@PathVariable
注解将URL路径中的变量值绑定到方法参数id
上。具体来说,当请求的URL路径为 “/depts/{id}”,例如 “/depts/123”,
@DeleteMapping("/depts/{id}")
注解表示这是一个用于处理HTTP DELETE请求的处理方法,并且路径中的{id}
部分将被解析为方法参数id
新增部门
@Override public void add(Dept dept) { dept.setCreateTime(LocalDateTime.now()); dept.setUpdateTime(LocalDateTime.now()); deptMapper.add(dept); }
补充属性指需要补充的属性
比如这里,前端传给我们其他参数,但修改时间和进入时间是我们来决定的,因此需要在这里增加
使用@RequestMapping优化
如何分辨使用注解获取服务器发过来的数据?(重点)
当请求数据是以下这样时(json格式)
{ "id": 1, "name": "教研部" }
- 是一个请求体数据,要使用能将请求体数据绑定的注解来实现
当请求数据是以下这样时(写在导航栏上),要使用能将请求的URL中提取路径参数的注解来实现
/depts/1
详情见http笔记
更新部门
- 在这个工程中更新部门需要点两次
- 先点击编辑弹出页面,输入修改的name属性。这个过程就执行了一次查询操作
- 然后点击确定,将修改好的name属性传递给后端
开发员工表相应功能
分页查询
- 详细要求去看相应api接口文档
- 接收参数需要默认值的时候,可以使用以上两种方式设置
public PageBean page(Integer page, Integer pageSize) { //获取总页数 Long count = empMapper.count(); //获取查询结果 //计算起始页码 Integer start = (page - 1) * pageSize; List<Emp> empList = empMapper.page(start, pageSize); //封装成对象 PageBean pageBean=new PageBean(count,empList); return pageBean; }
- 遇到多个数据时候,将其封装成一个对象来传输
PageHelper插件
- 该插件使用PageHelper对象进行操作
以下是使用 PageHelper
进行分页查询的一般步骤:
- 在项目的依赖管理中引入
PageHelper
的相关依赖,通常需要包括pagehelper-core
和mybatis-spring-boot-starter
。 - 在 MyBatis 的配置文件中,配置
PageInterceptor
作为拦截器。这样,PageHelper
就能够拦截查询语句,自动实现分页功能。 - 在需要进行分页查询的方法中,直接使用
PageHelper.startPage(pageNum, pageSize)
来设置当前页码和每页显示的记录数。 - 执行查询操作,
PageHelper
会自动进行分页处理,并返回一个包含分页结果的PageInfo
对象。
- 插件原理
在执行empMapper.list()方法时,就是执行:select * from emp 语句,怎么能够
实现分页操作呢?
分页插件帮我们完成了以下操作:
- 先获取到要执行的SQL语句:select * from emp
- 把SQL语句中的字段列表,变为:count(*)
- 执行SQL语句:select count(*) from emp //获取到总记录数
- 再对要执行的SQL语句:select * from emp 进行改造,在末尾添加 limit ? ,
?
- 执行改造后的SQL语句:select * from emp limit ? , ?
- 使用中的第一条,调用插件中的本体方法来设置分页参数
- 第二条通过插件将该条变成分页查询语句
//方式一:service层 public PageBean page(Integer page, Integer pageSize) { //获取总页数 Long count = empMapper.count(); //获取查询结果 //计算起始页码 Integer start = (page - 1) * pageSize; List<Emp> empList = empMapper.page(start, pageSize); //封装成对象 PageBean pageBean=new PageBean(count,empList); return pageBean; } //dao层 //查询总记录 @Select("select count(*) from webcase.emp") public Long count(); // 分页查询列表数据 @Select("select * from webcase.emp limit #{start},#{pageSize}") public List<Emp> page(Integer start,Integer pageSize);
//方式一:service层(使用插件) public PageBean page(Integer page, Integer pageSize) { //设置分页参数 PageHelper.startPage(page, pageSize); //获取数据 List<Emp> empList= empMapper.list(); Page<Emp> p=(Page<Emp>) empList; // 封装成对象 PageBean pageBean = new PageBean(p.getTotal(), p.getResult()); return pageBean; } //dao层 /*员工信息查询(使用插件)*/ @Select("select * from webcase.emp") public List<Emp> list(); } //(其中Emp用于接收传递的数据)
条件分页查询
- 后面还有新增员工和删除员工就不多赘述了
- 文件上传前端三要素
- 请求方式为post,要有file,特殊的编码格式
文件上传
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <title>上传文件</title> </head> <body> <form action="/upload" method="post" enctype="multipart/form-data"> //使用multipart/form-data格式能将数据提交上去,而不是将文件名提交 //使用该提交方式后,提交项会分成三个 姓名: <input type="text" name="username"><br> 年龄: <input type="text" name="age"><br> 头像: <input type="file" name="image"><br> <input type="submit" value="提交"> </form> </body> </html>
- 生成临时文件来上传,上传后将文件删除
@Slf4j @RestController public class UploadController { @PostMapping("/upload") public Result upload(String name, Integer age, MultipartFile image) throws IOException { log.info("接收到的参数name:{},age:{},image:{}",name,age,image); // 获取文件的原始名 String originalFilename= image.getOriginalFilename(); // 产生的临时文件保存在本地E:\image image.transferTo(new File("E:\\image\\"+originalFilename )); return Result.success(); } }//这样写,有一个明显的问题:后来的同名文件会替代原本的文件
@Slf4j @RestController public class UploadController { @PostMapping("/upload") public Result upload(String name, Integer age, MultipartFile image) throws IOException { log.info("接收到的参数name:{},age:{},image:{}",name,age,image); // 获取文件的原始名 String originalFilename= image.getOriginalFilename(); int index=originalFilename.lastIndexOf(".");//找到文件名最后.的位置 String extname=originalFilename.substring(index);//截取字符 //使用uuid创建文件名 String newFileName= UUID.randomUUID().toString()+extname; // 产生的临时文件保存在本地E:\image image.transferTo(new File("E:\\image\\"+newFileName )); return Result.success(); } }
- 在application.properties中配置
使用云来存储图片
private AliOSSUtils aliOSSUtils; /* 使用阿里云来上传图片 */ @PostMapping("/upload") public Result upload(MultipartFile image) throws IOException { log.info("文件上传,文件原始名:{}",image.getOriginalFilename(); /* 使用工具来将文件上传,并获得该文件的网络地址 */ String url= aliOSSUtils.upload(image); log.info("文件上传的地址:{}",url); return Result.success(url); }
@Component public class AliOSSUtils { //工具类 private String endpoint = "https://oss-cn-beijing.aliyuncs.com"; private String accessKeyId = "LTAI5tJcyLUHaXqJiTaw74Rd"; private String accessKeySecret = "mwRBKzxPC0BHFEwqQHZvCtvvlOIpho"; private String bucketName = "web-tlias-ww"; /** * 实现上传图片到OSS */ public String upload(MultipartFile file) throws IOException { // 获取上传的文件的输入流 InputStream inputStream = file.getInputStream(); // 避免文件覆盖 String originalFilename = file.getOriginalFilename(); String fileName = UUID.randomUUID().toString() + originalFilename.substring(originalFilename.lastIndexOf(".")); //上传文件到 OSS OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret); ossClient.putObject(bucketName, fileName, inputStream); //文件访问路径 String url = endpoint.split("//")[0] + "//" + bucketName + "." + endpoint.split("//")[1] + "/" + fileName; // 关闭ossClient ossClient.shutdown(); return url;// 把上传到oss的路径返回 } }
在postman中测试上传
- 选择Body中的form—data,在key中选择Filr
使用不同配置文件优化
使用@ConfigurationProperties代码再优化
登录
// 登录接口 @Slf4j @RestController public class LoginController { @Autowired private EmpService empService; @PostMapping("/login") public Result login(@RequestBody Emp emp){ log.info("用户登录:{}",emp); // 登录 Emp emp1= empService.Login(emp); return emp1!=null?Result.success():Result.error("用户名或秘密错误"); }//多了此项步骤,其他都一样 }
登录校验
会话技术
- Cookie技术
- Session技术
快速入门Web开发(下)(2):https://developer.aliyun.com/article/1548594