返回
10分钟掌握Spring Boot + Vue + Antd + US3,打造个人图床
见解分享
2024-02-19 00:21:52
网上已经有一些运行不错的图床了,比如SM.MS、图壳、路过图床等。那为什么我们还要自己搭建图床呢?
- 独立自主: 自建图床,可以完全控制数据,无需担心隐私泄露或服务中断。
- 成本低廉: US3是亚马逊云服务中性价比很高的对象存储服务,费用低廉。
- 扩展性强: US3具有良好的可扩展性,可以满足不断增长的存储需求。
在本教程中,你将学习如何使用Spring Boot和Vue搭建一个简单的图床,并使用Antd作为前端框架和US3作为对象存储服务。
搭建步骤
1. 创建Spring Boot项目
首先,创建一个新的Spring Boot项目,可以使用Spring Initializr。
2. 添加Maven依赖
在pom.xml文件中添加以下依赖:
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-web</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-data-jpa</artifactId>
</dependency>
<dependency>
<groupId>org.springframework.boot</groupId>
<artifactId>spring-boot-starter-actuator</artifactId>
</dependency>
<dependency>
<groupId>com.amazonaws</groupId>
<artifactId>aws-java-sdk-s3</artifactId>
</dependency>
3. 配置数据库
创建一个名为image.sql的文件,并添加以下内容:
CREATE TABLE image (
id INT NOT NULL AUTO_INCREMENT,
name VARCHAR(255) NOT NULL,
type VARCHAR(255) NOT NULL,
size INT NOT NULL,
url VARCHAR(255) NOT NULL,
PRIMARY KEY (id)
);
然后,在application.properties文件中添加以下配置:
spring.datasource.url=jdbc:mysql://localhost:3306/image
spring.datasource.username=root
spring.datasource.password=123456
spring.jpa.hibernate.ddl-auto=update
4. 创建实体类
创建一个名为Image.java的文件,并添加以下内容:
import javax.persistence.*;
@Entity
@Table(name = "image")
public class Image {
@Id
@GeneratedValue(strategy = GenerationType.IDENTITY)
private Integer id;
@Column(name = "name")
private String name;
@Column(name = "type")
private String type;
@Column(name = "size")
private Long size;
@Column(name = "url")
private String url;
//省略getter和setter方法
}
5. 创建Repository接口
创建一个名为ImageRepository.java的文件,并添加以下内容:
import org.springframework.data.jpa.repository.JpaRepository;
public interface ImageRepository extends JpaRepository<Image, Integer> {
}
6. 创建Service接口
创建一个名为ImageService.java的文件,并添加以下内容:
import org.springframework.stereotype.Service;
public interface ImageService {
void save(Image image);
Image findById(Integer id);
List<Image> findAll();
void delete(Integer id);
}
7. 创建ServiceImpl类
创建一个名为ImageServiceImpl.java的文件,并添加以下内容:
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.stereotype.Service;
@Service
public class ImageServiceImpl implements ImageService {
@Autowired
private ImageRepository imageRepository;
@Override
public void save(Image image) {
imageRepository.save(image);
}
@Override
public Image findById(Integer id) {
return imageRepository.findById(id).orElse(null);
}
@Override
public List<Image> findAll() {
return imageRepository.findAll();
}
@Override
public void delete(Integer id) {
imageRepository.deleteById(id);
}
}
8. 创建Controller类
创建一个名为ImageController.java的文件,并添加以下内容:
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.web.bind.annotation.*;
@RestController
@RequestMapping("/image")
public class ImageController {
@Autowired
private ImageService imageService;
@PostMapping