SpringBoot整合七牛云实现文件上传-天涯论坛

4zhvml8 发表于 2024-10-26 21:01:49

SpringBoot整合七牛云实现文件上传

在做项目的时候，咱们经常会遇到文件上传的需要，例如用户更换头像、上传详情照片等等，这个时候能够将上传的文件存放到项目的根目录下面，然则随着文件的数量的增加，文件会欠好管理并且拜访的速度亦不是火速
因此能够思虑存储空间进行文件的存储。对象存储是面向对象/文件的、海量的互联网存储，它亦能够直接被叫作为“云存储”。对象尽管是文件，它是已被封装的文件（编程中的对象就有封装性的特点），亦便是说，在对象存储系统里，你不可直接打开/修改文件，但能够像ftp同样上传文件，下载文件等
另一对象存储无像文件系统那样有一个非常多层级的文件结构，而是仅有一个“桶”（bucket）的概念（亦便是存储空间），“桶”里面所有都是对象，是一种非常扁平化的存储方式。其最大的特点便是它的对象名叫作便是一个域名位置，一旦对象被设置为“公开”，所有网民都能够拜访到它；它的持有者还能够经过REST API的方式拜访其中的对象
因此呢，对象存储最主流的运用场景，便是存储网站、移动app等互联网/移动互联网应用的静态内容（视频、照片、文件、软件安装包等等）
由于七牛云的对象存储空间是免费的，并且容量亦是相对够用的（因此还是选取白嫖一波吧）
<h1 style="color: black; text-align: left; margin-bottom: 10px;">准备工作</h1>注册七牛云账号，而后到掌控台中选取存储空间
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-axegupay5k/5d752ae2dcf643c5a21df1686df74b0d~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1729479280&x-signature=0%2B0XMywxcsuilAh41stn1CJuUNs%3D" style="width: 50%; margin-bottom: 20px;"></div>进去之后点击新建空间，一个空间相当于是一个文件夹，存放对象的位置
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/b935f75ec22648f3b324befe115d3ec1~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1729479280&x-signature=4rPrN16SZmZDa%2BKZCjRyFWBPLTQ%3D" style="width: 50%; margin-bottom: 20px;"></div>创建完成之后能够按照自己的需要是不是绑定域名（绑定的域名必须是备案过的）
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/82d83b88b9bf414b9c9b5a58d4a8b99d~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1729479280&x-signature=sn3z4yzhKqOSQNCiQymrnuYJyyw%3D" style="width: 50%; margin-bottom: 20px;"></div>点击密钥管理查看自己的密钥，在之后的文件上传和下载中都会用到
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/55a0ea1a12a3413482a3c908d3312a99~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1729479280&x-signature=rdISjdB8XL%2FjLaGUW7FbBhklNTQ%3D" style="width: 50%; margin-bottom: 20px;"></div>
<h1 style="color: black; text-align: left; margin-bottom: 10px;">代码测试</h1>
<h1 style="color: black; text-align: left; margin-bottom: 10px;">1、在pom.xml中引入对应的依赖</h1>
<dependency>
<groupId>com.qiniu</groupId>
<artifactId>qiniu-java-sdk</artifactId>
<version></version>
</dependency>
<dependency>
<groupId>com.google.code.gson</groupId>
<artifactId>gson</artifactId>
<version>2.8.5</version>
<scope>compile</scope>
</dependency>

<dependency>
<groupId>org.projectlombok</groupId>
<artifactId>lombok</artifactId>
<optional>true</optional>
</dependency>
<h1 style="color: black; text-align: left; margin-bottom: 10px;">2、编写配置application.yml配置文件</h1>qiniuyun:
#你的accessKey密钥
accessKey: xxx
#你的secretKey密钥
secretKey: xxx
#存储空间名叫作
bucket: xxx
#外链域名，即空间的默认域名
qiniu-image-domain: xxx
#链接过期时间，单位为秒，-1暗示不外期
expire-in-seconds: -1
<h1 style="color: black; text-align: left; margin-bottom: 10px;">3、编写QiNiuUtils工具类</h1>@Data
@Component
@ConfigurationProperties(prefix = "qiniuyun")
public class QiNiuUtils {

private String accessKey;

private String secretKey;

private String bucket;

@Value("${qiniuyun.qiniu-image-domain}")
private String QINIU_IMAGE_DOMAIN;

@Value("${qiniuyun.expire-in-seconds}")
private long expireSeconds;

public Auth getAuth(){
return Auth.create(accessKey,secretKey);
}

/*
 上传文件到存储空间
 */
public Stringupload(MultipartFile file){//构造一个带指定 Region 对象的配置类
Configuration cfg = new Configuration(Region.huadongZheJiang2());
//...其他参数参考类注释UploadManager uploadManager =new UploadManager(cfg);
Auth auth = getAuth();
String upToken = auth.uploadToken(bucket);
String url = null;
try{
Response response = uploadManager.put(file.getInputStream(), file.getOriginalFilename(), upToken,null,null);
url = QINIU_IMAGE_DOMAIN + JSONObject.parseObject(response.bodyString()).get("key");
//解析上传成功的结果
DefaultPutRet putRet = newGson().fromJson(response.bodyString(), DefaultPutRet.class);
System.out.println(putRet.key);
System.out.println(putRet.hash);//将上传完的照片的外链返回出去
return url;
} catch(Exception ex) {
ex.printStackTrace();
System.err.println(ex.toString());
}return url;
}

/*
 查看七牛云存储空间中的所有文件
 */
public void cat(){
//构造一个带指定 Region 对象的配置类
Configuration cfg = newConfiguration(Region.region0());
Auth auth = getAuth();
BucketManager manager =new BucketManager(auth, cfg);
//要查看文件名的前缀
String prefix = "Bicon";
int limit = 1000;
Stringdelimiter ="";
BucketManager.FileListIterator fileListIterator = manager.createFileListIterator(bucket, prefix, limit, delimiter);
while(fileListIterator.hasNext()) {//处理获取的file list结果
FileInfo[] items = fileListIterator.next();
List<FileInfo> fileInfos = Arrays.asList(items);
List<String> collect = fileInfos.stream().map(fileInfo -> {return QINIU_IMAGE_DOMAIN+fileInfo.key;
}).collect(Collectors.toList());
//将所有符合前缀的文件进行表示System.out.println(collect);
}
}/*
 获取文件拜访位置
 */
public String fileUrl(String fileName) throws UnsupportedEncodingException {
StringencodedFileName = URLEncoder.encode(fileName,"utf-8");
String publicUrl = String.format("%s/%s", QINIU_IMAGE_DOMAIN, encodedFileName);
Auth auth = getAuth();
long expireInSeconds = expireSeconds;if(-1 == expireInSeconds){
return auth.privateDownloadUrl(publicUrl);
}
returnauth.privateDownloadUrl(publicUrl, expireInSeconds);
}

}<h1 style="color: black; text-align: left; margin-bottom: 10px;">4、编写UploadController</h1>@RestController
public class UploadController {

//引入刚才写好的工具类
@Autowired
private QiNiuUtils qiNiuUtils;

@RequestMapping("/upload")
@CrossOrigin
public String upload(@RequestParam("file") MultipartFile file) throws IOException {
//获取到上传照片的外链String upload = qiNiuUtils.upload(file);return upload;
}

}<h1 style="color: black; text-align: left; margin-bottom: 10px;">5、在vue页面中添加一个上传组件</h1><template>

<el-upload :on-success="upload" :action="action" list-type="picture-card" :auto-upload="true">
</template>

<script>

 export default{
 data(){return{
 action: http://localhost:8080/upload
 }
 }
 methods:{
 upload(response){
 if(response.code==200){
 this.formAdd.gimg = response.objthis.$message.success(上传成功！)
 }else{
 this.$message.error(上传照片失败！)
 }
 },
 }
 }
</script>
<h1 style="color: black; text-align: left; margin-bottom: 10px;">6、在前端页面中选取文件并查看效果，或能够用API测试工具来进行测试</h1>
这儿我运用的是Apifox，大众亦能够用其他的API调试工具
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/1fddb4e6852e43958253784bc78e11df~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1729479280&x-signature=HjM4NEuKRmobGxKSBIGaiaG2hRo%3D" style="width: 50%; margin-bottom: 20px;"></div>
<h1 style="color: black; text-align: left; margin-bottom: 10px;">7、查看效果</h1>
<div style="color: black; text-align: left; margin-bottom: 10px;"><img src="https://p3-sign.toutiaoimg.com/tos-cn-i-6w9my0ksvp/a9dfc670bc944ca3932accc6a68ac3b8~noop.image?_iz=58558&from=article.pc_detail&lk3s=953192f4&x-expires=1729479280&x-signature=93rzCvxu0tJ4NVRV27YJE5mNGmc%3D" style="width: 50%; margin-bottom: 20px;"></div>
到这儿，已然实现了简单的将文件上传到七牛云上面啦，这儿的文件上传组件是选中完文件自动上传了，亦能够按照自己的需要变成点击按钮进行上传

页: [1]

天涯论坛's Archiver

SpringBoot整合七牛云实现文件上传