外链论坛

 找回密码
 立即注册
搜索
查看: 11|回复: 0

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

[复制链接]

3075

主题

2万

回帖

9910万

积分

论坛元老

Rank: 8Rank: 8

积分
99108803
发表于 2024-10-26 21:01:49 | 显示全部楼层 |阅读模式

在做项目的时候,咱们经常会遇到文件上传的需要例如用户更换头像、上传详情照片等等,这个时候能够将上传的文件存放到项目的根目录下面,然则随着文件的数量的增加,文件会欠好管理并且拜访的速度不是火速

因此能够思虑存储空间进行文件的存储。对象存储是面向对象/文件的、海量的互联网存储,它能够直接被叫作为“云存储”。对象尽管是文件,它是已被封装的文件(编程中的对象就有封装性的特点),便是说,在对象存储系统里,你不可直接打开/修改文件,但能够像ftp同样上传文件,下载文件等

另一对象存储像文件系统那样有一个非常多层级的文件结构,而是仅有一个“桶”(bucket)的概念(便是存储空间),“桶”里面所有都是对象,是一种非常扁平化的存储方式。其最大的特点便是它的对象名叫作便是一个域名位置,一旦对象被设置为“公开”,所有网民都能够拜访到它;它的持有者还能够经过REST API的方式拜访其中的对象

因此呢,对象存储最主流的运用场景,便是存储网站、移动app等互联网/移动互联网应用的静态内容(视频、照片、文件、软件安装包等等)

由于七牛云的对象存储空间是免费的,并且容量是相对够用的(因此还是选取白嫖一波吧)

准备工作

注册七牛云账号,而后掌控台中选取存储空间
进去之后点击新建空间,一个空间相当于是一个文件夹,存放对象的位置
创建完成之后能够按照自己的需要是不是绑定域名(绑定的域名必须是备案过的)
点击密钥管理查看自己的密钥,在之后的文件上传和下载中都会用到

代码测试

1、在pom.xml中引入对应的依赖

<!-- 七牛云对应依赖 --> <dependency> <groupId>com.qiniu</groupId> <artifactId>qiniu-java-sdk</artifactId> <version>[7.7.0, 7.10.99]</version> </dependency> <dependency> <groupId>com.google.code.gson</groupId> <artifactId>gson</artifactId> <version>2.8.5</version> <scope>compile</scope> </dependency> <!-- lombok依赖 --> <dependency> <groupId>org.projectlombok</groupId> <artifactId>lombok</artifactId> <optional>true</optional> </dependency>

2、编写配置application.yml配置文件

qiniuyun: #你的accessKey密钥 accessKey: xxx #你的secretKey密钥 secretKey: xxx #存储空间名叫作 bucket: xxx #外链域名,即空间的默认域名 qiniu-image-domain: xxx #链接过期时间,单位为秒,-1暗示不外 expire-in-seconds: -1

3、编写QiNiuUtils工具类

@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); } }

4、编写UploadController

@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; } }

5、在vue页面中添加一个上传组件

<template> <!-- on-success:上传成功后调用的办法 action:选中文件之后的请求路径 auto-upload:是否自动上传文件 --> <el-upload n-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>

6、在前端页面中选取文件并查看效果,能够用API测试工具来进行测试

这儿运用的是Apifox,大众能够用其他的API调试工具

7、查看效果

这儿已然实现了简单的将文件上传到七牛云上面啦,这儿的文件上传组件是选中完文件自动上传了,能够按照自己的需要变成点击按钮进行上传

回复

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则

站点统计|Archiver|手机版|小黑屋|外链论坛 ( 非经营性网站 )|网站地图

GMT+8, 2024-11-9 09:30 , Processed in 0.087416 second(s), 20 queries .

Powered by Discuz! X3.4

Copyright © 2001-2023, Tencent Cloud.