图床系统-SpringBoot+vue

53 阅读2分钟

淘宝店铺搜索:点创微科

图床系统-SpringBoot+vue

本项目为前几天收费帮学妹做的一个项目,在工作环境中基本使用不到,但是很多学校把这个当作编程入门的项目来做,故分享出本项目供初学者参考

一、项目描述

图床系统

系统架构: 基于Spring Boot和Vue的图床用户管理系统,提供图像上传、管理及用户权限控制等核心功能,适用于个人或小团队使用。 采用阿里云oss存储图片。前后端分离,JWT令牌,ElementPlus UI,

登录网址 http://localhost:3000/

账号:lst123 密码:lst123

可以重新注册

二、项目功能

用户体系

支持普通用户注册、登录、找回密码。

管理员可后台登录,拥有完全权限。

管理员可在后台新增、编辑、禁用、删除任意用户,并分配角色。

图片上传

单张最大 10 MB,支持 jpg、jpeg、png、gif。

提供拖拽上传、点击上传、剪贴板粘贴三种方式。

上传后自动生成多格式外链(直链、Markdown、HTML 等),方便分享。

图片管理

普通用户在“图片管理”页查看、搜索、删除自己上传的图片。

管理员可在“所有图片”页查看、搜索、删除全站图片,也可按用户筛选。

列表展示缩略图、文件名、上传时间、文件大小,支持一键复制外链。

个人中心

用户可修改头像、昵称、邮箱、手机号、密码。

实时显示个人已用存储空间与剩余配额。

后台统计

仪表盘展示总用户数、今日新增、总图片数、今日上传、总存储占用。

折线图按日/周/月展示上传趋势。

权限与安全

路由级权限拦截,未登录无法进入后台。

管理员登录与普通用户登录入口分离。

所有操作均有角色校验,防止越权。

系统提示

上传失败时返回具体原因(如 Bucket 命名不规范)。

操作成功或失败均通过顶部消息条即时反馈。

三、运行环境

开发工具 :idea

运行环境 :jdk-21、maven-3.8.6、MySQL5.7.26

(此配置为本人调试所用,仅供参考)

四、项目技术

服务端技术:Spring Boot

前端技术:vue

以上系统源码经过技术整理与调试,确保能正常运行

五、项目截图

1753167487-afc0121f5e06dd5.png

1753167489-0466a97a1ecbb65.png

1753167491-5ade9355089e35b.png

1753167493-8130d465b39481b.png

1753167495-460781807d8f86c.png

1753167497-81ab4729c0ef74f.png

1753167500-c519890e28b1f09.png

1753167503-0dd3089be232350.png

1753167505-5fdcf65d8347b5b.png

1753167508-ff525a0506dd8d9.png

1753167511-3bd18b2525d56c2.png

1753167514-f95f1f6561072c0.png

1753167517-2979c195143bdc2.png

1753167520-c4425c57f2cda79.png

0c6f25b0fc054fd88c8dd70eac55b61f~tplv-73owjymdk6-jj-mark-v1_0_0_0_0_5o6Y6YeR5oqA5pyv56S-5Yy6IEAg6Z2S6Z2S5a2m5aeQ_q75.webp