vue+elmentUI+springboot实现阿里云oss的图片上传

一、获取OSS的相关配置

前几天研究了一下阿里云的oss图片上传,觉得网上的代码要不就是没有写完,要不就是不够全面。于是自己整理了一下,后端的代码大都来自另一位作者,下面有标明出处。
可能有点长,挑重点看。

①创建阿里云的账号,购买oss

首先登陆阿里云的官网: 阿里云官网,注册一个账号。可以用钉钉或者支付宝注册。
然后,去开通oss服务。因为我是开通了的,所以图片上显示的是控制台,没有开通的会显示开通服务。在这里插入图片描述
然后根据步骤来开通就好。
阿里云会有新人活动,满足注册未满6个月而且没有购买过阿里云的用户即可免费领取一个月,找不到的搜索 “试用中心”
不过一般来说,他们的客服会非常贴心的打来电话和你聊聊。
在这里插入图片描述
我是全部选了默认。
在这里插入图片描述

②创建Bucket,获取AccessKey ID和AccessKey Secret

找到控制台,打开左侧菜单栏的对象存储oss。
找到右边的创建Bucket,这个东西就像你git上放项目的库,之后会把上传的东西放在上面。
在这里插入图片描述
因为只是试用,其他的多余的并没有开通。

首先是地域,选自己近的就好,之后要用到。

修改了文件的权限为公共读,可以让浏览器通过url访问到。

然后就是存储类型,收费是不同的,标准存储最贵。他会提示你的,不过我是领了免费的,所以选了最贵的。
在这里插入图片描述

在这里插入图片描述
然后再创建一个文件夹。
就可以手动的添加文件了,当然我们的目的是要在用vue+springboot的上传,并且传入数据库,可以在查看新闻的时候查看图片。

现在,来获取AccessKey ID和AccessKey Secret。
在这里插入图片描述
创建key
在这里插入图片描述
在这里插入图片描述
一定要及时保存,不然的话,key之后就找不到了。

二、后端代码解读

图片上传的代码研究了好久,也没写好,可能是我太蠢了吧哈哈哈哈。
不过找到了另一位的作者的文章,我就是用了他的,代码很简洁,而且注释多,还有源码。^ _ ^
springboot操作阿里云OSS实现文件上传,下载,删除(附源码)

①依赖和application.yml的配置

其中第一个依赖,源码说他的版本不加上会报错,我是
spring-boot:2.1.17版本,不加第一个依赖,也不会报错。主要是后面两个依赖。

        <dependency>
            <groupId>org.springframework.boot</groupId>
            <artifactId>spring-boot-configuration-processor</artifactId>
            <optional>true</optional>
        </dependency>
        <!-- aliyun-oos -->
        <dependency>
            <groupId>com.aliyun.oss</groupId>
            <artifactId>aliyun-sdk-oss</artifactId>
            <version>2.8.3</version>
        </dependency>
        <dependency>
            <groupId>joda-time</groupId>
            <artifactId>joda-time</artifactId>
            <version>2.10.1</version>
        </dependency>

配置application.yml也可以叫application.properties,我在这里发现一个东西很奇妙。
大家知道xxx.yml和xxx.properties其实是一个东西,不过yml有更好的书写规范。在springboot的配置中,是可以随时相互切换的。如下,是不是觉得右边的看起来更舒服。在这里插入图片描述

然后我在写代码的时候原本的properties切换成了yml结尾,然后报了一个文件找不到的错。
所以我就有个疑问了,之前springboot的配置文件,我都是随便什么格式都可以用,这个因为有一个配置类写了@PropertySource(value = {“classpath:application.yml”})然后如果代码是yml但是你写的是properties他就会报错,注释不加后缀也会报错。
觉得很神奇,但是暂时没找到原因。(个_个)

好,话题回来,继续配置。
accessKeyId: 你的id,之前保存了的
accessKeySecret: 你的key
bucketName: 你的仓库名
endPoint: 请对照的你选择的仓库( 访问域名
fileHost: 在bucket中创建的文件夹名
urlPrefix: 地址,http://+仓库名+外网地址

max-file-size: 单个文件上传最大
max-request-size: 一次性上传最大
如果是想要不限制文件上传的大小,那么就把两个值都设置为-1(没试验过,因为网速太差)

# 这是yml格式
aliyun:
    accessKeyId: LTAI4G8UhTXXXXXXXXXXX
    accessKeySecret: gXKga5z9fHrKHswXXXXXXXXXX
    bucketName: news-01
    endPoint: oss-cn-shanghai.aliyuncs.com
    fileHost: test1
    urlPrefix: http://news-01.oss-cn-shanghai.aliyuncs.com/
spring:
    servlet:
        multipart:
            max-file-size: 100MB
            max-request-size: 1000MB    
# 这是properties格式
aliyun.accessKeyId=LTAI4G8UhTXXXXXXXXXXX
aliyun.accessKeySecret=gXKga5z9fHrKHswXXXXXXXXXX
aliyun.bucketName=news-01
aliyun.endPoint=oss-cn-shanghai.aliyuncs.com
aliyun.fileHost=test1
aliyun.urlPrefix=http://news-01.oss-cn-shanghai.aliyuncs.com/
spring.servlet.multipart.max-file-size=100MB
spring.servlet.multipart.max-request-size=1000MB

好了,application.properties的配置就到这了。

②配置类AliyunOssConfig

配置类主要住吧刚刚配置的application.yml的内容加入到spring上下文,要你可以通过注入去找到这个属性的值。

package com.zking.springboot2.util;

import com.aliyun.oss.OSS;
import com.aliyun.oss.OSSClient;
import lombok.Data;
import lombok.experimental.Accessors;
import org.springframework.boot.context.properties
  • 7
    点赞
  • 25
    收藏
    觉得还不错? 一键收藏
  • 3
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 3
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值