SpringBoot整合阿里云OSS文件上传、下载、查看、删除

转x33g5p2x  于2021-12-23 转载在 Spring  
字(12.6k)|赞(0)|评价(0)|浏览(799)

SpringBoot整合阿里云OSS文件上传、下载、查看、删除

该项目源码地址：https://github.com/ggb2312/springboot-integration-examples （其中包含SpringBoot和其他常用技术的整合，配套源码以及笔记。基于最新的 SpringBoot2.1+，欢迎各位 Star）

1. 开发前准备

1.1 前置知识

  • java基础
  • SpringBoot简单基础知识

1.2 环境参数

  • 开发工具：IDEA
  • 基础环境：Maven+JDK8
  • 所用技术：SpringBoot、lombok、阿里云OSS存储服务
  • SpringBoot版本：2.1.4

1.3 涉及知识点

  • OSS简介，以及阿里云OSS控制台快速入门使用
  • SpringBoot 整合 阿里云OSS 存储服务，进行文件上传、下载、查看、删除
  • 阿里云OSS文档介绍，以及快速入门使用
  • lombok入门使用以及IDEA lombok插件安装
  • SpringMVC与AJAX前后端分离交互
  • AJAX文件异步上传

2. 使用阿里云OSS

对象存储OSS的多重冗余架构设计，为数据持久存储提供可靠保障。

2.1 创建Bucket

使用OSS，首先需要创建Bucket，Bucket翻译成中文是水桶的意思，把存储的图片资源看做是水，想要盛水必须得
有桶。
进入控制台，https://oss.console.aliyun.com/overview

创建完成后，在左侧可以看到已经创建好的Bucket：

选择Bucket后，即可看到对应的信息，如：url、消耗流量等

2.2 管理文件

可以通过在线的方式进行管理文件

2.3 阿里云OSS文档

阿里云OSS文档

右侧的开发指南说的更加详细

阿里云虽然提供了完整的文档，但是做一个完整的前后端交互的文件上传、下载、查看、删除等操作，对于小白来说还是有点难度的，所以我把自己学习OSS的步骤以及代码分享了出来，共有需要的人使用。

3. 项目初始化

3.1 创建SpringBoot项目

在Idea中File——>New——>Project

3.2 Maven依赖

导入Maven相关依赖

  1. <dependency>
  2.             <groupId>com.aliyun.oss</groupId>
  3.             <artifactId>aliyun-sdk-oss</artifactId>
  4.             <version>2.8.3</version>
  5.         </dependency>
  7.         <dependency>
  8.             <groupId>org.projectlombok</groupId>
  9.             <artifactId>lombok</artifactId>
  10.             <version>1.18.4</version>
  11.             <scope>provided</scope>
  12.         </dependency>
  14.         <dependency>
  15.             <groupId>joda-time</groupId>
  16.             <artifactId>joda-time</artifactId>
  17.             <version>2.9.9</version>
  18.         </dependency>
  20.         <dependency>
  21.             <groupId>org.apache.commons</groupId>
  22.             <artifactId>commons-lang3</artifactId>
  23.             <version>3.8.1</version>
  24.         </dependency>

3.3 安装lombok插件

因为项目中使用了lombok的@Data注解，当然你也可以自己写get、set等方法。
File——>settings——>Plugins

然后restart IDEA即可。

4. 后端服务编写

4.1 阿里云OSS配置

在resource下新建一个application-oss.properties

  1. aliyun.endpoint=oss-cn-shanghai.aliyuncs.com
  2. aliyun.accessKeyId=你的accessKeyId
  3. aliyun.accessKeySecret=你的accessKeySecret
  4. aliyun.bucketName=gaojun-testbucket
  5. aliyun.urlPrefix=http://gaojun-testbucket.oss-cn-shanghai.aliyuncs.com/
  6. spring.servlet.multipart.max-file-size=100MB
  7. spring.servlet.multipart.max-request-size=1000MB

endpoint、bucketName、urlPrefix在OSS主面板就可以看到

accessKeyId、accessKeySecret需要在accesskeys里面查看

在java的包下新建一个config包，创建一个AliyunConfig.java

  1. package com.example.ossdemo.config;
  3. import com.aliyun.oss.OSS;
  4. import com.aliyun.oss.OSSClient;
  5. import lombok.Data;
  6. import org.springframework.boot.context.properties.ConfigurationProperties;
  7. import org.springframework.context.annotation.Bean;
  8. import org.springframework.context.annotation.Configuration;
  9. import org.springframework.context.annotation.PropertySource;
  10. /** * @desc */
  11. @Configuration
  12. @PropertySource(value = {"classpath:application-oss.properties"})
  13. @ConfigurationProperties(prefix = "aliyun")
  14. @Data
  15. public class AliyunConfig {
  16.     private String endpoint;
  17.     private String accessKeyId;
  18.     private String accessKeySecret;
  19.     private String bucketName;
  20.     private String urlPrefix;
  22.     @Bean
  23.     public OSS oSSClient() {
  24.         return new OSSClient(endpoint, accessKeyId, accessKeySecret);
  25.     }
  26. }

4.2 后端业务

4.2.1 vo

该实体类用于后台返回给前台。

  1. package com.example.ossdemo.vo;
  3. import lombok.Data;
  5. /** * @desc 用于前后端交互的返回值 */
  6. @Data
  7. public class FileUploadResult {
  8.     // 文件唯一标识
  9.     private String uid;
  10.     // 文件名
  11.     private String name;
  12.     // 状态有：uploading done error removed
  13.     private String status;
  14.     // 服务端响应内容，如：'{"status": "success"}'
  15.     private String response;
  16. }

4.2.2 service

在service使用ossClient操作阿里云OSS，进行上传、下载、删除、查看所有文件等操作，同时可以将图片的url进行入库操作。

  1. package com.example.ossdemo.service;
  3. import com.aliyun.oss.OSS;
  4. import com.aliyun.oss.model.*;
  5. import com.example.ossdemo.config.AliyunConfig;
  6. import com.example.ossdemo.vo.FileUploadResult;
  7. import org.apache.commons.lang3.RandomUtils;
  8. import org.apache.commons.lang3.StringUtils;
  9. import org.joda.time.DateTime;
  10. import org.springframework.beans.factory.annotation.Autowired;
  11. import org.springframework.stereotype.Service;
  12. import org.springframework.web.multipart.MultipartFile;
  14. import java.io.*;
  15. import java.util.List;
  17. /** * @desc */
  18. @Service
  19. public class FileUploadService {
  20.     // 允许上传的格式
  21.     private static final String[] IMAGE_TYPE = new String[]{".bmp", ".jpg",
  22.             ".jpeg", ".gif", ".png"};
  23.     @Autowired
  24.     private OSS ossClient;
  25.     @Autowired
  26.     private AliyunConfig aliyunConfig;
  28.     /** * @author lastwhisper * @desc 文件上传 * 文档链接 https://help.aliyun.com/document_detail/84781.html?spm=a2c4g.11186623.6.749.11987a7dRYVSzn * @email gaojun56@163.com */
  29.     public FileUploadResult upload(MultipartFile uploadFile) {
  30.         // 校验图片格式
  31.         boolean isLegal = false;
  32.         for (String type : IMAGE_TYPE) {
  33.             if (StringUtils.endsWithIgnoreCase(uploadFile.getOriginalFilename(),
  34.                     type)) {
  35.                 isLegal = true;
  36.                 break;
  37.             }
  38.         }
  39.         //封装Result对象，并且将文件的byte数组放置到result对象中
  40.         FileUploadResult fileUploadResult = new FileUploadResult();
  41.         if (!isLegal) {
  42.             fileUploadResult.setStatus("error");
  43.             return fileUploadResult;
  44.         }
  45.         //文件新路径
  46.         String fileName = uploadFile.getOriginalFilename();
  47.         String filePath = getFilePath(fileName);
  48.         // 上传到阿里云
  49.         try {
  50.             ossClient.putObject(aliyunConfig.getBucketName(), filePath, new
  51.                     ByteArrayInputStream(uploadFile.getBytes()));
  52.         } catch (Exception e) {
  53.             e.printStackTrace();
  54.             //上传失败
  55.             fileUploadResult.setStatus("error");
  56.             return fileUploadResult;
  57.         }
  58.         fileUploadResult.setStatus("done");
  59.         fileUploadResult.setResponse("success");
  60.         //this.aliyunConfig.getUrlPrefix() + filePath 文件路径需要保存到数据库
  61.         fileUploadResult.setName(this.aliyunConfig.getUrlPrefix() + filePath);
  62.         fileUploadResult.setUid(String.valueOf(System.currentTimeMillis()));
  63.         return fileUploadResult;
  64.     }
  66.     /** * @author lastwhisper * @desc 生成路径以及文件名 例如：//images/2019/04/28/15564277465972939.jpg * @email gaojun56@163.com */
  67.     private String getFilePath(String sourceFileName) {
  68.         DateTime dateTime = new DateTime();
  69.         return "images/" + dateTime.toString("yyyy")
  70.                 + "/" + dateTime.toString("MM") + "/"
  71.                 + dateTime.toString("dd") + "/" + System.currentTimeMillis() +
  72.                 RandomUtils.nextInt(100, 9999) + "." +
  73.                 StringUtils.substringAfterLast(sourceFileName, ".");
  74.     }
  76.     /** * @author lastwhisper * @desc 查看文件列表 * 文档链接 https://help.aliyun.com/document_detail/84841.html?spm=a2c4g.11186623.2.13.3ad5b5ddqxWWRu#concept-84841-zh * @email gaojun56@163.com */
  77.     public List<OSSObjectSummary> list() {
  78.         // 设置最大个数。
  79.         final int maxKeys = 200;
  80.         // 列举文件。
  81.         ObjectListing objectListing = ossClient.listObjects(new ListObjectsRequest(aliyunConfig.getBucketName()).withMaxKeys(maxKeys));
  82.         List<OSSObjectSummary> sums = objectListing.getObjectSummaries();
  83.         return sums;
  84.     }
  86.     /** * @author lastwhisper * @desc 删除文件 * 文档链接 https://help.aliyun.com/document_detail/84842.html?spm=a2c4g.11186623.6.770.4f9474b4UYlCtr * @email gaojun56@163.com */
  87.     public FileUploadResult delete(String objectName) {
  88.         // 根据BucketName,objectName删除文件
  89.         ossClient.deleteObject(aliyunConfig.getBucketName(), objectName);
  90.         FileUploadResult fileUploadResult = new FileUploadResult();
  91.         fileUploadResult.setName(objectName);
  92.         fileUploadResult.setStatus("removed");
  93.         fileUploadResult.setResponse("success");
  94.         return fileUploadResult;
  95.     }
  97.     /** * @author lastwhisper * @desc 下载文件 * 文档链接 https://help.aliyun.com/document_detail/84823.html?spm=a2c4g.11186623.2.7.37836e84ZIuZaC#concept-84823-zh * @email gaojun56@163.com */
  98.     public void exportOssFile(OutputStream os, String objectName) throws IOException {
  99.         // ossObject包含文件所在的存储空间名称、文件名称、文件元信息以及一个输入流。
  100.         OSSObject ossObject = ossClient.getObject(aliyunConfig.getBucketName(), objectName);
  101.         // 读取文件内容。
  102.         BufferedInputStream in = new BufferedInputStream(ossObject.getObjectContent());
  103.         BufferedOutputStream out = new BufferedOutputStream(os);
  104.         byte[] buffer = new byte[1024];
  105.         int lenght = 0;
  106.         while ((lenght = in.read(buffer)) != -1) {
  107.             out.write(buffer, 0, lenght);
  108.         }
  109.         if (out != null) {
  110.             out.flush();
  111.             out.close();
  112.         }
  113.         if (in != null) {
  114.             in.close();
  115.         }
  116.     }
  117. }

4.2.3 controller

controller进行接收用户请求

  1. package com.example.ossdemo.controller;
  3. import com.aliyun.oss.model.OSSObjectSummary;
  4. import com.example.ossdemo.service.FileUploadService;
  5. import com.example.ossdemo.vo.FileUploadResult;
  6. import org.springframework.beans.factory.annotation.Autowired;
  7. import org.springframework.http.HttpHeaders;
  8. import org.springframework.http.HttpStatus;
  9. import org.springframework.http.MediaType;
  10. import org.springframework.http.ResponseEntity;
  11. import org.springframework.stereotype.Controller;
  12. import org.springframework.web.bind.annotation.RequestMapping;
  13. import org.springframework.web.bind.annotation.RequestParam;
  14. import org.springframework.web.bind.annotation.ResponseBody;
  15. import org.springframework.web.multipart.MultipartFile;
  17. import javax.servlet.http.HttpServletResponse;
  18. import java.io.IOException;
  19. import java.io.InputStream;
  20. import java.net.URLEncoder;
  21. import java.util.List;
  23. /** * @desc */
  24. @Controller
  25. public class FileUploadController {
  26.     @Autowired
  27.     private FileUploadService fileUploadService;
  29.     /** * @desc 文件上传到oss * @return FileUploadResult * @Param uploadFile */
  30.     @RequestMapping("file/upload")
  31.     @ResponseBody
  32.     public FileUploadResult upload(@RequestParam("file") MultipartFile uploadFile)
  33.             throws Exception {
  34.         return this.fileUploadService.upload(uploadFile);
  35.     }
  37.     /** * @return FileUploadResult * @desc 根据文件名删除oss上的文件 * http://localhost:8080/file/delete?fileName=images/2019/04/28/1556429167175766.jpg * @Param objectName */
  38.     @RequestMapping("file/delete")
  39.     @ResponseBody
  40.     public FileUploadResult delete(@RequestParam("fileName") String objectName)
  41.             throws Exception {
  42.         return this.fileUploadService.delete(objectName);
  43.     }
  45.     /** * @author lastwhisper * @desc 查询oss上的所有文件 * http://localhost:8080/file/list * @return List<OSSObjectSummary> * @Param */
  46.     @RequestMapping("file/list")
  47.     @ResponseBody
  48.     public List<OSSObjectSummary> list()
  49.             throws Exception {
  50.         return this.fileUploadService.list();
  51.     }
  53.     /** * @author lastwhisper * @desc 根据文件名下载oss上的文件 * @return * @Param objectName */
  54.     @RequestMapping("file/download")
  55.     @ResponseBody
  56.     public void download(@RequestParam("fileName") String objectName, HttpServletResponse response) throws IOException {
  57.         //通知浏览器以附件形式下载
  58.         response.setHeader("Content-Disposition",
  59.                 "attachment;filename=" + new String(objectName.getBytes(), "ISO-8859-1"));
  60.         this.fileUploadService.exportOssFile(response.getOutputStream(),objectName);
  61.     }
  62. }

5. 前端页面编写与测试

5.1 文件上传页面

使用ajax异步文件上传到后端对接的OSS上。

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  6.     <title>oss文件上传</title>
  7.     <script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.11.2/jquery.js"></script>
  8.     <script> function uploadfile() { $("#fileTypeError").html(''); //获得文件名称 var fileName = $('#file_upload').val(); //截取文件类型,如(.jpg)　　　　　　　　　　　　　　　　 var fileType = fileName.substr(fileName.length - 4, fileName.length); if (fileType == '.bmp' || fileType == '.jpg' || fileType == '.jpeg' || fileType == '.gif' || fileType == '.png') {　　　　　//验证文件类型,此处验证也可使用正则 $.ajax({ url: 'file/upload',//上传地址 type: 'POST', cache: false, data: new FormData($('#uploadForm')[0]),//表单数据 processData: false, contentType: false, success: function (rtn) { if (rtn.status == 'error') { $("#fileTypeError").html('*上传文件类型错误,支持类型: .bmp .jpg .jpeg .gif .png');　　//根据后端返回值,回显错误信息 } else { $('div').append('<img src="' + rtn.name + '" style="width: 300px;height: 300px"></img>') } } }); } else { $("#fileTypeError").html('*上传文件类型错误,支持类型: .bmp .jpg .jpeg .gif .png'); } } </script>
  9. </head>
  10. <body>
  11. <form id="uploadForm" enctype="multipart/form-data">　　<!-- 声明文件上传 -->
  12.     <input id="file_upload" type="file" name="file"/>　　<!-- 定义change事件,选择文件后触发 -->
  13.     <br/><span style="color: red" id="fileTypeError"></span>　　　　<!-- 文件类型错误回显,此处通过前后端两次验证文件类型 -->
  14.     <br/><input type="button" onclick="uploadfile()" value="上传">
  15. </form>
  16. <div></div>
  17. </body>
  18. </html>

效果展示：

5.2 文件管理页面

  1. <!DOCTYPE html>
  2. <html lang="en">
  3. <head>
  4.     <meta charset="UTF-8">
  5.     <title>oss文件管理</title>
  6.     <script type="text/javascript" src="https://cdn.bootcss.com/jquery/1.11.2/jquery.js"></script>
  7.     <script type="text/javascript"> var pre = 'https://gaojun-testbucket.oss-cn-shanghai.aliyuncs.com/'; $(function () { listfile(); }); //文件列表 function listfile() { $.ajax({ url: "http://localhost:8080/file/list", type: 'POST', success: function (rtn) { console.log(rtn.length); for (var i = 0; i < rtn.length; i++) { $('div').append('<img src="' + pre + rtn[i].key + '" style="width: 300px;height: 300px; padding: 10px" οndblclick="deletefile(this.src)" οnclick="downloadfile(this.src)"></img>') } } }); } //文件下载 function downloadfile(src) { var fileName = src.split(pre)[1]; window.location.href = "http://localhost:8080/file/download?fileName=" + fileName; } //文件删除 function deletefile(src) { var fileName = src.split(pre)[1]; var param = {fileName: fileName}; $.ajax({ url: "http://localhost:8080/file/delete", data: param, success: function () { alert('删除成功',fileName); //删除页面 location.reload(); } }); } </script>
  8. </head>
  9. <body>
  10. 单击下载oss上的图片、双击删除oss上的图片<br>
  11. <div>
  13. </div>
  14. </body>
  15. </html>

效果展示：

刚才上传了一张照片，可以立马看到

单击页面即可下载图片

双击即可删除图片：

版权说明 : 本文为转载文章, 版权归原作者所有 版权申明

原文链接 : https://blog.csdn.net/qq_43842093/article/details/122097319

内容来源于网络，如有侵权，请联系作者删除！

Javaspringboot阿里云

相关文章

    查看更多

    热门标签

    更多
    JavaquerypythonNode开发语言requestUtil数据库Table后端算法LoggerMessageElementParser

    最新文章

    更多
    • 蜀ICP备13028337号-1 大数据知识库 https://www.saoniuhuo.com © All rights reserved
    • 本站内容来源互联网,如果侵犯您的权益请联系我们删除, 联系方式：448109455@qq.com