关于兼容性问题,ie8以下的可以使用4.x的版本
一、引入sdk和jq
<script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script>
二、基本配置
var client =new OSS.Wrapper({ region:'', accessKeyId:'‘, accessKeySecret:'', bucket:'' })
region:阿里云服务器地址
accessKeyId:您的key
accessKeySecret:您的密码,
bucket:你要上传到那个文件夹下; 这个需要在阿里云服务器建立
三、获取文件列表
client.list({ 'max-keys':10 }).then(function(res) { console.log(res) }).catch(function(err){ console.log(err) })
这个时候一般会出现跨越问题,解决办法是:
1.选择你自己新建的Bucket文件
2.找到tab栏中的基础设置
3.设置跨越
当上传的文件超过100k时会报错,解决方法是在下图中暴露Headers选项中加入:
etag
x-oss-request-id
x-oss-meta-test
这三个值即可。
四、完整代码
<!DOCTYPE html> <html lang="en"> <head> <meta charset="UTF-8"> <meta name="viewport" content="width=device-width, initial-scale=1.0"> <meta http-equiv="X-UA-Compatible" content="ie=edge"> <title>js oss文件上传测试</title> <script src="http://libs.baidu.com/jquery/2.0.0/jquery.min.js"></script> <script src="http://gosspublic.alicdn.com/aliyun-oss-sdk-4.4.4.min.js"></script> </head> <body> <input type="file" name="" id="file" value=""/> <script type="text/javascript"> var client =new OSS.Wrapper({ region:'', accessKeyId:'', accessKeySecret:'', bucket:'' }) //获取oss文件列表 client.list({ 'max-keys':10 }).then(function(res) { console.log(res) }).catch(function(err){ console.log(err) }) $("#file").change(function () { client.multipartUpload(this.files[0].name, this.files[0]).then(function (result) { console.log(result); }).catch(function (err) { console.log(err); }); }); </script> </body> </html>
参考地址:
https://www.cnblogs.com/ossteam/p/4942227.html
https://blog.csdn.net/dc2222333/article/details/79409513
https://www.cnblogs.com/MainActivity/p/8492211.html