JavaScript客户端直传OSS,服务端签名

一、介绍
公司项目中遇到上传图片至OSS,因为OSS支持POST协议,所以只要在Plupload发送POST请求时带上OSS签名即可。废话不多说,直蹦主题。

二、具体步骤:
(1):服务端签名
因为客户端通过JavaScript把AccesssKeyID 和AccessKeySecret写在代码里面有泄露的风险,所以采用服务端签名后直传。
客户端请求服务端获取AccesssKeyID 、AccessKeySecret等参数。
(2):OSS为Bucket设置跨域规则以支持Post方法
具体操作步骤请参见设置跨域访问。
设置CORS:
在这里插入图片描述
(3):表单提交携带后台返回的OSS签名
在这里插入图片描述
注:
status如果为201可以接收到xml文件格式的数据,可利用x2js解析xml为JSON。

(4):如果想在上传时固定设置成随机文件名,后缀保持跟客户端文件一致,可以将函数改为:

function check_object_radio() {
    g_object_name_type = 'random_name';
}

(5):如果想在上传时固定设置成用户的文件名,可以将函数改为:

function check_object_radio() {
    g_object_name_type = 'local_name';
}

(6):您可以将文件上传到指定目录下。下面的代码是将上传目录改成abc/,注意目录必须以正斜线(/)结尾。

function get_dirname()
{
    g_dirname = "abc/"; 
}

(7):上传签名主要是对policyText进行签名,最简单的例子如下:

var policyText = {
    "expiration": "2020-01-01T12:00:00.000Z", // 设置Policy的失效时间,如果超过失效时间,就无法通过此Policy上传文件
    "conditions": [
    ["content-length-range", 0, 1048576000] // 设置上传文件的大小限制,如果超过限制,文件上传到OSS会报错
    ]
}

三、API
JavaScript客户端签名直传

评论 6
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

打赏作者

前端小小白zyw

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

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

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

打赏作者

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

抵扣说明:

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

余额充值