Vue+Springboot最简单实现上传头像

<el-upload action="/api/users/change_avatar">
     <el-button size="small" type="primary">点击上传</el-button>
</el-upload>

前端就一个按钮，实现上传到后端接口（action便是自己设计的后端接收头像的接口）

public JsonResult <String> changeAvatar(
            HttpSession session,@RequestPart("file") MultipartFile file){
        //判断文件是否为空
        if(file.isEmpty()){
            throw new FileEmptyException("文件为空");
        }
        if(file.getSize()>AVATAR_MAX_SIZE){
            throw new FileSizeException("文件超出限制");  //判断是否超过限制
        }
        //判断文件类型是否是所规定的后缀类型
        String contentType = file.getContentType();
        if(!AVATAR_TYPE.contains(contentType)){
            throw new FileTypeException("文件类型不支持");
        }
        //上传的文件.../upload/文件.png
        String parent = session.getServletContext().getRealPath("upload");
        //File对象指向这个路径，File是否存在
        File dir = new File(parent);
        if(!dir.exists()) {//检测目录是否存在
            dir.mkdirs();  //创建当前目录
        }
        //获取文件名称，UUID获取新字符串作为文件名
        String originalFilename = file.getOriginalFilename();
        int index=originalFilename.lastIndexOf(".");
        String suffix = originalFilename.substring(index);
        //新文件名字
        String filname= UUID.randomUUID().toString().toUpperCase()+suffix;

        File dest=new File(dir,filname);  //此时为空
        try {
            file.transferTo(dest);   //参数file中数据写入空文件(dest)中
        }catch (FileStateException e){
            throw new FileStateException("文件状态异常");
        }
        catch (IOException e) {
            throw new FileUploadIOException("文件读写异常");
        }
        Integer uid = getuidFromSession(session);
        String username = getUsernameFromSession(session);
        //返回头像的路径/upload/test.png
        String avatar="/upload/"+filname;
        userService.changeAvatar(uid,avatar,username);
        //返回用户头像路径给前端页面，用于头像展示使用
        System.out.println(username);
        return new JsonResult<>(OK,avatar);
    }

后端接受文件，通过Session获得对应用户的个人信息，进行数据库update操作(也可根据需求，减少某些代码）