鉴于安全性,本文采用的是服务端签名后直传方式。
本文分为两部分讲解:
- JavaScript客户端签名直传
- 小程序签名直传
一、JavaScript客户端签名直传
上传中使用了 plupload. 详见plupload官方文档
阿里云 JavaScript客户端签名直传 官方文档
本文中的代码是经过删改过后的代码,若想看完整的具体代码,请点击:
阿里官方客户端代码 下载
// html部分
<div id="upload-container">
<div id="upload-monitor">
<span>上传</span>
</div>
</div>
// 代码中使用的Base64、Crypto、plupload在官方客户端代码中均有
var fileName = ''; // 上传的文件名称。可以使用原本的文件名称,也可以使用随机的文件名(自由发挥)
var accessid = ''; // 记录请求后端接口获取到的阿里的accessid
var accesskey = ''; // 记录请求后端接口获取到的阿里的accesskey
var token = ''; // 记录请求后端接口获取到的阿里的token
var host = 'http://xxx.xxx.aliyuncs.com'; // OSS访问域名
var policyBase64 = ''; // 上传文件时所需要的policy
var signature = ''; // 签名
var uploadConfig = {
}; // 定义的上传的配置对象
// 获取阿里token等相关信息的方法
function getToken(){
}
getToken().then(function(res){
if(res.success){
// (这个看后端返回的字段名叫什么,此处是随便一写~)
accessid = res.accessid;
accesskey = res.accesskey;
token = res.token;
var policyText = {
//设置该Policy的失效时间,超过这个失效时间之后,就没有办法通过这个policy上传文件了
'expiration': res.expiration,
'conditions': [
['content-length-range', 0, 1048576000] // 设置上传文件的大小限制
]
};
policy