龙空技术网

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

坏女人克星 185

前言:

当前兄弟们对“七牛云图片外链”可能比较看重,兄弟们都需要学习一些“七牛云图片外链”的相关资讯。那么小编在网上网罗了一些关于“七牛云图片外链””的相关知识,希望朋友们能喜欢,朋友们一起来学习一下吧!

在做项目的时候,我们经常会遇到文件上传的需求,比如用户更换头像、上传详情图片等等,这个时候可以将上传的文件存放到项目的根目录下面,但是随着文件的数量的增多,文件会不好管理并且访问的速度也不是很快

所以可以考虑存储空间进行文件的存储。对象存储是面向对象/文件的、海量的互联网存储,它也可以直接被称为“云存储”。对象尽管是文件,它是已被封装的文件(编程中的对象就有封装性的特点),也就是说,在对象存储系统里,你不能直接打开/修改文件,但可以像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 String upload(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 = new Gson().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 = new Configuration(Region.region0());        Auth auth = getAuth();        BucketManager manager = new BucketManager(auth, cfg);        //要查看文件名的前缀        String prefix = "Bicon";        int limit = 1000;        String delimiter = "";        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 {        String encodedFileName = 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);        }        return auth.privateDownloadUrl(publicUrl, expireInSeconds);    }}
4、编写UploadController
@RestControllerpublic 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 :on-success="upload" :action="action" list-type="picture-card" :auto-upload="true"></template><script>export default {  data(){      return{          action: ';      }  }  methods:{      upload(response){        if(response.code==200){          this.formAdd.gimg = response.obj          this.$message.success('上传成功!')        }else{          this.$message.error('上传图片失败!')        }      },  }}</script>
6、在前端页面中选择文件并查看效果,或者可以用API测试工具来进行测试

这里我使用的是Apifox,大家也可以用其他的API调试工具

7、查看效果

到这里,已经实现了简单的将文件上传到七牛云上面啦,这里的文件上传组件是选中完文件自动上传了,也可以根据自己的需要变成点击按钮进行上传

标签: #七牛云图片外链