SpringBoot + Vue 前后端分离（用户信息更新&头像上传&Markdown图片上传）

SpringBoot + Vue 前后端分离（用户信息更新&头像上传&Markdown图片上传）

文章目录

• 前言
• 用户信息更新
• • 前端发送
  • 后端接口
• 修改用户头像
• • 前端
  • • 前端图片显示
    • 图片上传
    • 完整 代码
  • 后端代码
  • • 图片存储
    • 图片上传工具类
    • • 图片工具类的配置
      • 工具类实现
  • 效果
• Markdown 图片上传
• • 前端
  • 后端
  • 效果

前言

说实话我是真没想到就这么简单的功能我还会踩坑，没办法前端写得烂，发送数据格式不对，后端的图片处理又不对，烦死了，不过还好后面有搞回来了，现在做个简单记录。到这里的话，后面就是如何整合那个Markdown编辑器，然后就是博客表的设计，分页获取数据，之后就是用户权限的设置，现在的话还没有后台管理，不过这个也好办主要是后面的文章审核，管理要用到，总的来说到周末还是有机会完成的，毕竟下个礼拜我要去展示一下我的项目作为期末作业，虽然这个是web的大二学校才刚刚教java，这次交个简单的桌面即可，但是这又不是我，理论上我还可以交安卓，交Flink的作品，但是前者没意思，uniapp香呀，还要啥安卓反正我又不是专业的前端，后者这玩意太抽象，我总不能说让Flink 跑个算法吧。所以web是比较理想的，刚好复习springboot 玩玩前后端分离。

用户信息更新

这个其实就是简单的CURD，后端拿到数据，然后更新即可，但是这里刚好涉及到用户验证，也就是token检测，这个可以去看看这篇
SpringBoot+Vue前后端分离实战（用户注册登录）
这个其实是一系列的记录。

这里几个比较重要的数据交互，一个是用户更新后的信息和状态，一个是token。

前端发送