文件上传及MyBatis相关内容

最新推荐文章于 2024-07-20 12:18:20 发布

KaKaa__

最新推荐文章于 2024-07-20 12:18:20 发布

阅读量563

点赞数

文章标签： mybatis sql 数据库

本文链接：https://blog.csdn.net/KaKaa__/article/details/127866735

版权

前言

今天来讲讲网页中的文件上传是如何实现的,以及如何在MyBatis框架中用XML来配置SQL语句.

一、文件上传

1.从ElementUI官方文档中把组件相关代码复制到自己工程中, 在标签中添加action属性设置提交地址, name属性设置提交参数的名称, limit设置上传图片的数量, :on-success 上传完成时调用的方法.

2.上传文件需要在application.properties中设置最大上传文件大小, 设置静态资源文件夹(默认静态资源文件夹为static)

前端代码

<!DOCTYPE html>
<html lang="en">
<head>
    <meta charset="UTF-8">
    <title>Title</title>
</head>
<body>
<div>
  <h1>微博列表页面</h1>
  <div v-for="weibo in arr">
    <h3>{{weibo.content}}</h3>
    <img :src="weibo.url" width="100">
  </div>
</div>
<script src="https://cdn.bootcdn.net/ajax/libs/axios/0.21.1/axios.min.js"></script>
<script src="https://cdn.staticfile.org/vue/2.2.2/vue.min.js"></script>
<script>
    let v = new Vue({
        el:"body>div",
        data:{
          arr:[]
        },
        methods:{
        },
        created:function () {
          //页面加载出来时发请求获取所有微博数据
          axios.get("/select").then(function (response) {
            v.arr = response.data;
          })
        }
    })
</script>
</body>
</html>

后端代码

@RestController
    public class UploadController {
        @RequestMapping("/upload")
        public String upload(MultipartFile pic) throws IOException {
            System.out.println("pic = " + pic);
            //得到原始文件名   a.jpg
            String fileName = pic.getOriginalFilename();
            System.out.println(fileName);
            //得到文件名的后缀   .jpg
            String suffix = fileName.substring(fileName.lastIndexOf("."));
            //得到唯一文件名 UUID.randomUUID()得到一个由16进制组成的一个唯一标识符
            fileName = UUID.randomUUID()+suffix;
            System.out.println(fileName);
            //准备保存图片的文件夹路径
            String dirPath = "d:/files";
            File dirFile = new File(dirPath);
            //判断如果文件夹不存在 则创建
            if (!dirFile.exists()){
                dirFile.mkdirs();//创建文件夹
            }
            //准备文件的完整路径  d:/files/xxxxx.jpg
            String filePath = dirPath+"/"+fileName;
            //把图片保存到指定路径  异常抛出
            pic.transferTo(new File(filePath));
            //将上传成功的图片路径响应给客户端
            //响应的是网络路径(http://localhost:8080/xxx.jpg)
            // 并非磁盘路径(d:/files/xxxx.jpg)
            return "/"+fileName;
        }
    
        @RequestMapping("/remove")
        public void remove(String url){
            // url = /xxxx.jpg
            //删除指定路径的文件  d:/files/xxxx.jpg
            new File("d:/files"+url).delete();
        }
    }

配置文件application.properties

spring.datasource.url=jdbc:mysql://localhost:3306/bootdb?characterEncoding=utf8&serverTimezone=Asia/Shanghai&useSSL=false
spring.datasource.username=root
spring.datasource.password=root
# 设置上传文件大小限制  默认1MB
spring.servlet.multipart.max-file-size=10MB
# 设置静态资源文件夹 classpath:static再次设置static为静态资源文件夹
spring.resources.static-locations=file:d:/files,classpath:static
# 设置 mapper配置文件的位置
mybatis.mapper-locations=classpath:mappers/*xml