ALI-OSS web签名直传文件解读

想考虑这样几个问题

1、web签名直传与sdk提供的上传有什么不同?

2、web端上传后,怎么获取传输在服务器里的文件(怎么下载)

解读:

首先我们回顾下官方文档描述:

传送门:https://help.aliyun.com/document_detail/31926.html?spm=5176.doc31925.6.631.RZK0QY

逻辑图就不粘贴复制了,使用这样的上传方式就是为了安全,服务端账号密码维护方便,利于前后端分离模式

要清楚的两个逻辑点:
1、客户端要上传图片时,到应用服务器取上传的policy及签名。
2、客户端拿到签名直接上传到OSS。
3、在控制台中加入两个配置:跨域设置,域名配置

废话不多说直接上码:

码前说明:
BUCKET_NAME :你在服务器中创建的存储空间名,在它里面就可以进行存储了,还可以创建文件夹;
url后缀ENDPOINT:找对应自己使用的,在sdk中随处可查
dirName:文件夹名称,自己定义

***这是Client 实例里面的三个参数你们都有
public static OSSClient getOSSClient() {
        OSSClient ossClient = new OSSClient(ENDPOINT, ACCESS_KEY_ID,
                ACCESS_KEY_SECRET);
        return ossClient;
    }
        String host = "http://" + BUCKET_NAME + "." + "ENDPOINT";//这里的ENDPOINT记得是去掉http://的格式。url不可能存在两个http头的
        OSSClient ossClient = null;
        try {
            ossClient = getOSSClient();
            long expireTime = 30;
            long expireEndTime = System.currentTimeMillis() + expireTime * 1000;
            java.sql.Date expiration = new java.sql.Date(expireEndTime);
            PolicyConditions policyConds = new PolicyConditions();
            policyConds.addConditionItem(PolicyConditions.COND_CONTENT_LENGTH_RANGE, 0, 1048576000);
            policyConds.addConditionItem(MatchMode.StartWith, PolicyConditions.COND_KEY, dirName);

            String postPolicy = ossClient.generatePostPolicy(expiration, policyConds);
            byte[] binaryData = postPolicy.getBytes("utf-8");
            String encodedPolicy = BinaryUtil.toBase64String(binaryData);
            String postSignature = ossClient.calculatePostSignature(postPolicy);

            Map<String, String> respMap = new LinkedHashMap<String, String>();//这里主要是给前端更多的可读写信息所以过分的封装了,如果前端对你不好,就少给他几个,让他自己截取去
            respMap.put("accessid", ACCESS_KEY_ID);
            respMap.put("policy", encodedPolicy);
            respMap.put("signature", postSignature);
            respMap.put("bucketName", BUCKET_NAME);
            respMap.put("dir", dirName);
            respMap.put("host", host);
            respMap.put("expire", String.valueOf(expireEndTime / 1000));
            JSONObject ja1 = JSONObject.fromObject(respMap);
            System.out.println(ja1.toString());
            return ja1.toString();
        } catch (Exception e) {
            ossClient.shutdown();
            log.error("AliOSSUtil ---- >> fileUrl 下载地址异常, e = {}", e);
            return null;
        }

上面要注意的几个容易写的参数已经描述的很清楚了,接下来疯狂的复制输出就行了

下面是重点:

前端获取到Map中的参数封装web直传代码,官方文档写好了,疯狂输出就可以了,
前端传输中有个key,画上重点,他对你很重要,我刚昨天接触这个接口时误以为会返回给前端个url或者其他直连方式,后来测了几个小时无济于事果断想把他手里的key用掉,接着去看自己以前写的下载信息。在SDK-授权访问 中有这样的一个方法:使用URL签名授权访问
你的key和你命名空间参数放进去,疯狂输出吧,也可以下载回本地,本文到此结束,希望能帮助各位快速开发少走弯路。不喜勿喷谢谢

ali-oss 是阿里云提供的 OSS(Object Storage Service)的 JavaScript SDK,可以在浏览器端和 Node.js 环境下使用。Vue.js 是一个流行的前端框架,常用于开发单页面应用程序。 在 Vue.js 中使用 ali-oss 可以方便地上传和下载文件到阿里云 OSS。下面是 ali-oss 的依赖详解: 1. 安装 ali-oss 在 Vue.js 中使用 ali-oss 需要先安装它。可以使用 npm 安装: ``` npm install ali-oss --save ``` 2. 引入 ali-oss 在 Vue.js 中使用 ali-oss 需要先引入它。可以在 Vue 组件中使用 import 引入: ``` import OSS from 'ali-oss' ``` 3. 创建 OSS 实例 在使用 ali-oss 之前,需要先创建一个 OSS 实例。可以使用以下代码创建: ``` const client = new OSS({ region: '<your region>', accessKeyId: '<your accessKeyId>', accessKeySecret: '<your accessKeySecret>', bucket: '<your bucket>' }) ``` 其中,region 是 OSS 存储所在的区域,accessKeyId 和 accessKeySecret 是阿里云账号的 AccessKey,bucket 是要操作的存储桶名称。 4. 上传文件 使用 ali-oss 可以方便地上传文件OSS。可以使用以下代码上传文件: ``` const result = await client.put('object-key', 'local-file'); ``` 其中,object-key 是上传到 OSS文件路径,local-file 是本地文件路径。 5. 下载文件 使用 ali-oss 可以方便地下载文件到本地。可以使用以下代码下载文件: ``` const result = await client.get('object-key', 'local-file'); ``` 其中,object-key 是 OSS 中的文件路径,local-file 是本地文件路径。 总的来说,ali-oss 可以方便地在 Vue.js 中上传和下载文件到阿里云 OSS。在使用 ali-oss 时,需要先安装并引入它,然后创建一个 OSS 实例,最后使用 put() 或 get() 方法上传或下载文件
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

无厘头の码农

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值