流程如下

具体方法参考如下
1.获取签名
thirdparty服务内编写如下controller,有根据上面的API里的方法进行修改
把几个需要的属性通过@Value获取到了,然后删除了跨域的处理
package com.atguigu.gulimall.thirdparty.controller;
import com.aliyun.oss.OSS;
import com.aliyun.oss.common.utils.BinaryUtil;
import com.aliyun.oss.model.MatchMode;
import com.aliyun.oss.model.PolicyConditions;
import org.springframework.beans.factory.annotation.Autowired;
import org.springframework.beans.factory.annotation.Value;
import org.springframework.web.bind.annotation.RequestMapping;
import org.springframework.web.bind.annotation.RestController;
import java.text.SimpleDateFormat;
import java.util.Date;
import java.util.LinkedHashMap;
import java.util.Map;
/**
* @author rengang
* @version 1.0
* @date 2020/10/15 16:01
*/
@RestController
public class OssController {
@Autowired
public OSS ossClient;
@Value("${spring.cloud.alicloud.access-key}")
public String accessId;
@Value("${spring.cloud.alicloud.secret-key}")
public String accessKey;
@Value("${spring.cloud.alicloud.oss.endpoint}")
public String endpoint;
@Value("${spring.cloud.alicloud.oss.bucket}")
public String bucket;
@RequestMapping("/oss/policy")
public Map<String, String> poliy(){
String host = "https://" + bucket + "." + endpoint; // host的格式为 bucketname.endpoint
// callbackUrl为 上传回调服务器的URL,请将下面的IP和Port配置为您自己的真实信息。
String dataStr = new SimpleDateFormat("yyyy-MM-dd").format(new Date());
String dir = dataStr + "/"; // 用户上传文件时指定的前缀。
Map<String, String> respMap = new LinkedHashMap<String, String>();
try {
// 创建OSSClient实例。
long expireTime = 30;
long expireEndTime = System.currentTimeMillis() + expireTime * 1000;
Date expiration = new Date(expireEndTime);
// PostObject请求最大可支持的文件大小为5 GB,即CONTENT_LENGTH_RANGE为5*1024*1024*1024。
PolicyConditions policyConds = new PolicyConditions();
policyConds.addConditionItem(PolicyConditions.COND_CONTENT_LENGTH_RANGE, 0, 1048576000);
policyConds.addConditionItem(MatchMode.StartWith, PolicyConditions.COND_KEY, dir);
String postPolicy = ossClient.generatePostPolicy(expiration, policyConds);
byte[] binaryData = postPolicy.getBytes("utf-8");
String encodedPolicy = BinaryUtil.toBase64String(binaryData);
String postSignature = ossClient.calculatePostSignature(postPolicy);
respMap.put("accessid", accessId);
respMap.put("policy", encodedPolicy);
respMap.put("signature", postSignature);
respMap.put("dir", dir);
respMap.put("host", host);
respMap.put("expire", String.valueOf(expireEndTime / 1000));
// respMap.put("expire", formatISO8601Date(expiration));
} catch (Exception e) {
// Assert.fail(e.getMessage());
System.out.println(e.getMessage());
} finally {
ossClient.shutdown();
}
return respMap;
// return R.ok().put("data",respMap);
}
}
2.修改网关路由
网关内我们之前就加了跨域的配置类,后面还会加别的东西,所以所有服务调用都经过网关

3.浏览器访问测试成功获取签名

4.拷贝上传组件
拷到component文件夹下

5.引入组件

6.修改文件存放路径
去掉 '/' 因为 oss在创建文件夹的时候会自动在文件夹名后加 /,第一次就是因为没注意到这点失败了

7.跨域权限设置
因为从前端到OSS是跨域,这里没有经过我们的应用服务器,所以要添加跨域设置
点击权限管理就可以看到,设置成如下

8.添加上传组件
把原本的输入框改为 上传组件 el-upload上传的目标地址记得要改,是http://bucket+endpoint
9.新增界面测试上传成功
可以看到文件上传成功了


本文档详细介绍了如何使用阿里云OSS服务进行前端文件上传。首先,通过Java控制器生成签名,包括获取Access ID、Secret Key、Endpoint和Bucket等信息。然后,在网关中配置跨域,确保前端请求能够正常访问。接着,测试并获取上传所需的签名数据,包括accessid、policy、signature、dir、host和expire。在前端,引入上传组件,修改文件存放路径,并设置跨域权限。最后,通过浏览器测试,文件成功上传到OSS。
129

被折叠的 条评论
为什么被折叠?



