15分钟教你使用 Spring Boot Thymeleaf自定义一个的图床管理工具！

你的名字 2023-07-04 14:30 16阅读 0赞

## SpringBoot OSS 服务自定义图床 ##

源码地址：https://github.com/Snailclimb/springboot-aliyun-oss

### 前言 ###

疫情之下，每天都是好吃懒做啊！反正在家闲着没有事情，于是乎，花了一天时间写了这个简单项目。其实我本来是准备继续完善一下，然后部署到自己的云服务器上当作自己的相册。后来实在太懒了，也不想写前端了，于是留下了一些代办。

项目虽小，但是五脏俱全，可以直接拿来当作工具使用，代码写的虽然仓促，但是总体上应该没有什么大问题，初学者也可以直接拿来学习。

总的来说，这个项目主要能为你提供这些帮助：

1.  阿里云 oss 作为图床服务非常常用，简单封装和了解一下有助于你以后使用；
2.  技术栈使用 SpringBoot 和 thymeleaf 模板引擎，前端框架用的是国产好评较多的 layui。这个项目可以带你走一遍前后端一起开发的流程。

> 我会写 React 和 Vue 但是考虑到大部分后端的朋友没有接触过，所以直接用 thymeleaf整的，话说 layui 也还是第一次用！都是跟着 layui 官网找葫芦画瓢一步一步写的前端页面 。

### 效果展示 ###

> 页面长的比较丑，没有花太多时间在这个上面，将就着看一下。

bilibili 在线观看：https://www.bilibili.com/video/av88090586

上传页面

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM0MzM3Mjcy_size_16_color_FFFFFF_t_70][]

上传成功

![watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM0MzM3Mjcy_size_16_color_FFFFFF_t_70 1][]

### 技术栈 ###

*  后端： Spring Boot
 *  前端： thymeleaf 模板引擎 layui 框架

之前 React 和 Vue 都写过，还是第一次用 thymeleaf 加上 layai 来开发前端，总的来说，我还是喜欢 React 多一点。

### 启动项目 ###

**1.克隆到本地**

git clone git@github.com:Snailclimb/springboot-aliyun-oss.git

**2.使用idea或者其他开发工具打开项目**

**3.添加****`application.yml`****，内容如下：**

> ps：我在用 git 提交的时候将`application.yml` 忽略掉了，所以你需要手动添加到你的本地。

spring:
      servlet:
        multipart:
          max-file-size: 10MB
          max-request-size: 10MB
      thymeleaf:
        #关闭thymeleaf的缓存，不然在开发过程中修改页面不会立刻生效需要重启，生产可配置为true
        prefix: classpath:/web/
        cache: false
        suffix: .html
    aliyun:
      oss:
        bucket-name: my-blog-to-use
        endpoint: oss-cn-beijing.aliyuncs.com
        access-key-id: 替换为你的key id
        #阿里云主账号AccessKey拥有所有API的访问权限，风险很高。建议创建并使用RAM账号进行API访问或日常运维，请登录 https://ram.console.aliyun.com 创建RAM账号。
        access-key-secret: 替换为你的key secret
        file-host: test

**4.运行项目即可！**

### 代办 ###

*  \[x\] 单个图片的上传和删除（前后端）
 *  \[x\] 查看所有图片（后端）
 *  \[ \] 查看所有图片（前端）
 *  \[ \] 查看所有图片的时候可以对图片进行操作比如删除
 *  \[ \] ......

### 开源项目推荐 ###

作者的其他开源项目推荐：

1.  [JavaGuide][]：【Java学习 面试指南】 一份涵盖大部分Java程序员所需要掌握的核心知识。
2.  [springboot-guide][] : 适合新手入门以及有经验的开发人员查阅的 Spring Boot 教程（业余时间维护中，欢迎一起维护）。
3.  [programmer-advancement][] : 我觉得技术人员应该有的一些好习惯！
4.  [spring-security-jwt-guide][] :从零入门 ！Spring Security With JWT（含权限验证）后端部分代码。

### 公众号 ###

![20200212104028280.png][]

[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM0MzM3Mjcy_size_16_color_FFFFFF_t_70]: https://img-blog.csdnimg.cn/20200212104026432.jpeg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM0MzM3Mjcy,size_16,color_FFFFFF,t_70
[watermark_type_ZmFuZ3poZW5naGVpdGk_shadow_10_text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM0MzM3Mjcy_size_16_color_FFFFFF_t_70 1]: https://img-blog.csdnimg.cn/20200212104027999.jpeg?x-oss-process=image/watermark,type_ZmFuZ3poZW5naGVpdGk,shadow_10,text_aHR0cHM6Ly9ibG9nLmNzZG4ubmV0L3FxXzM0MzM3Mjcy,size_16,color_FFFFFF,t_70
[JavaGuide]: https://github.com/Snailclimb/JavaGuide
[springboot-guide]: https://github.com/Snailclimb/springboot-guide
[programmer-advancement]: https://github.com/Snailclimb/programmer-advancement
[spring-security-jwt-guide]: https://github.com/Snailclimb/spring-security-jwt-guide
[20200212104028280.png]: https://img-blog.csdnimg.cn/20200212104028280.png