1.开通OSS服务
2.搭建OSS环境
2.1创建Bucket存储空间
- 选择 Bucket列表,进行Bucket创建
2.2创建文件夹上传图片
- 创建文件夹
- 上传图片
2.3RAM访问控制
- 在头像中,点击“AccessKey管理”进行RAM设置
安全提醒,使用子用户
创建用户组:
添加用户
添加用户到用户组
设置权限
- 获取子用户AccessKeyId,AccessKeySecret
2.快速入门
2.1下载SDK
- 在“常用入口”中,点击“SDK下载”
- 点击“Java SDK”
- 添加坐标
<dependency> <groupId>com.aliyun.oss</groupId> <artifactId>aliyun-sdk-oss</artifactId> <version>3.10.2</version> </dependency>
2.2创建存储空间
// Endpoint以杭州为例,其它Region请按实际情况填写。 String endpoint = "https://oss-cn-hangzhou.aliyuncs.com"; // 阿里云主账号AccessKey拥有所有API的访问权限,风险很高。强烈建议您创建并使用RAM账号进行API访问或日常运维,请登录RAM控制台创建RAM账号。 String accessKeyId = "<yourAccessKeyId>"; String accessKeySecret = "<yourAccessKeySecret>"; String bucketName = "<yourBucketName>"; // 创建OSSClient实例。 OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret); // 创建存储空间。 ossClient.createBucket(bucketName); // 关闭OSSClient。 ossClient.shutdown();
- 例如:
1.
package com.czxy; import com.aliyun.oss.OSS; import com.aliyun.oss.OSSClientBuilder; import org.junit.Test; public class TestOss { @Test public void testCreateBucket() { // Endpoint以杭州为例,其它Region请按实际情况填写。 String endpoint = "oss-cn-shanghai.aliyuncs.com"; // 阿里云主账号AccessKey拥有所有API的访问权限,风险很高。强烈建议您创建并使用RAM账号进行API访问或日常运维,请登录RAM控制台创建RAM账号。 String accessKeyId = "LTAI5t7oNGMkQJ1X8RqtLet2"; String accessKeySecret = "这里是密码"; String bucketName = "czxy-lt-01"; // 创建OSSClient实例。 OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret); // 创建存储空间。 ossClient.createBucket(bucketName); // 关闭OSSClient。 ossClient.shutdown(); } }
2.3上传图片
- 参考代码位置:
- 例如:
@Test public void testUpload() throws FileNotFoundException { // yourEndpoint填写Bucket所在地域对应的Endpoint。以华东1(杭州)为例,Endpoint填写为https://oss-cn-hangzhou.aliyuncs.com。 String endpoint = "oss-cn-shanghai.aliyuncs.com"; // 阿里云账号AccessKey拥有所有API的访问权限,风险很高。强烈建议您创建并使用RAM用户进行API访问或日常运维,请登录RAM控制台创建RAM用户。 String accessKeyId = "LTAI5t7oNGMkQJ1X8RqtLet2"; String accessKeySecret = "这是密码"; // 创建OSSClient实例。 OSS ossClient = new OSSClientBuilder().build(endpoint, accessKeyId, accessKeySecret); String path = "avatar/" + System.currentTimeMillis() + ".png"; // 数据流 InputStream inputStream = new FileInputStream("C:/Users/Administrator/Desktop/1/cz.png"); // 填写Bucket名称和Object完整路径。Object完整路径中不能包含Bucket名称。 ossClient.putObject("czxy-lt", path, inputStream); // 关闭OSSClient。 ossClient.shutdown(); // https://czxy-lt.oss-cn-shanghai.aliyuncs.com/avatar/1616253283637.png String url = "https://czxy-lt.oss-cn-shanghai.aliyuncs.com/" + path; System.out.println(url); }
3.课程管理
3.1需求
3.2前端实现
- 添加上传组件和头像组件
<el-form-item label="课程封面"> <el-upload class="upload-demo" :action="updateUrl" :limit="1" :on-exceed="handleExceed" :on-success="avatarUploadSuccess"> <el-button size="small" type="primary">点击上传</el-button> <div slot="tip" class="el-upload__tip">只能上传jpg/png文件,且不超过500kb</div> </el-upload> <el-avatar shape="square" :size="50" :src="course.cover"></el-avatar> </el-form-item>
编写上传路径
data() { return { updateUrl: process.env.VUE_APP_BASE_API + '/course-service/course/avatar/upload', //上传路径 } }
编写处理函数:上传成功后,显示头像
handleExceed(files, fileList) { //默认 this.$message.warning(`当前限制选择 3 个文件,本次选择了 ${files.length} 个文件,共选择了 ${files.length + fileList.length} 个文件`); }, avatarUploadSuccess(response) { // 设置头像 this.course.cover = response.data }
3.3后端测试数据
@PostMapping("/avatar/upload") public BaseResult avatarUpload(MultipartFile file) { String url = "https://wpimg.wallstcn.com/f778738c-e4f8-4870-b634-56703b4acafe.gif?imageView2/1/w/80/h/80"; return BaseResult.ok("上传成功", url); }
3.4后端实现
3.4.1配置类
- yml 配置
aliyun: oss: file: endpoint: oss-cn-shanghai.aliyuncs.com keyId: LTAI5t7oNGMkQJ1X8RqtLet2 keySecret: 这里是密码 dirName: avatar bucketName: czxy-lt
配置类
package com.czxy.zx.course.oss; import lombok.Data; import org.springframework.boot.context.properties.ConfigurationProperties; import org.springframework.stereotype.Component; @Data @Component @ConfigurationProperties(prefix = "aliyun.oss.file") public class OssProperties { private String endpoint; private String keyId; private String keySecret; private String dirName; private String bucketName; }
3.4.2上传工具类
package com.czxy.zx.course.oss; import com.aliyun.oss.OSS; import com.aliyun.oss.OSSClientBuilder; import com.czxy.zx.exception.EduException; import org.springframework.stereotype.Component; import org.springframework.web.multipart.MultipartFile; import javax.annotation.Resource; import java.io.FileInputStream; import java.io.IOException; import java.io.InputStream; @Component public class OssUtils { @Resource private OssProperties ossProperties; public String upload(MultipartFile file) { if(file == null) { throw new EduException("上传文件为空"); } try { // 创建OSSClient实例。 OSS ossClient = new OSSClientBuilder().build(ossProperties.getEndpoint(), ossProperties.getKeyId(), ossProperties.getKeySecret()); String path = ossProperties.getDirName() + "/" + System.currentTimeMillis() + ".png"; // 数据流 InputStream inputStream = file.getInputStream(); // 填写Bucket名称和Object完整路径。Object完整路径中不能包含Bucket名称。 ossClient.putObject(ossProperties.getBucketName(), path, inputStream); // 关闭OSSClient。 ossClient.shutdown(); String url = "https://"+ossProperties.getBucketName()+"."+ossProperties.getEndpoint()+"/" + path; return url; } catch (IOException e) { throw new EduException("文件上传有误"); } } }
3.4.3上传功能
注入工具
调用工具
@PostMapping("/avatar/upload") public BaseResult avatarUpload(MultipartFile file) { String url = ossUtils.upload(file); return BaseResult.ok("上传成功", url); }