前端上传文件至阿里云

前端上传文件至阿里云

1、html

<input type="file" name="picFieldName" id="picFieldId" onchange="uploadPic(this)" />

2、js

　　var client = new OSS.Wrapper({
        region: 'oss-cn-beijing',
        accessKeyId: 'X8Tartapp0w0VNj6ZrMej4',
        accessKeySecret: 'VziKartappfO9oXMINPnvzaJNcgcvE0mYWCq',
        bucket: 'artapp-dev-bucket'
    });
    function uploadPic(obj){
        var file=obj.files[0];//获取文件流
        var val= obj.value;
        var suffix = val.substr(val.indexOf("."));
        var storeAs = "studio_course/"+timestamp()+suffix;
        console.log(file.name + ' => ' + storeAs);
        client.multipartUpload(storeAs, file).then(function (result) {

        }).catch(function (err) {
            console.log(err);
        });
    }


    /**
     * 生成文件名
     * @returns
     */
    function timestamp(){
        var time = new Date();
        var y = time.getFullYear();
        var m = time.getMonth()+1;
        var d = time.getDate();
        var h = time.getHours();
        var mm = time.getMinutes();
        var s = time.getSeconds();
        console.log(y);
        return ""+y+add0(m)+add0(d)+add0(h)+add0(mm)+add0(s);
    }
    function add0(m){
        return m<10?'0'+m : m;
    }

参数备注:

　　accessKeyId：连接阿里云的accessKeyId

　　accessKeySecret：连接阿里云的accessKeyScret

　　dir：文件夹的名称

　　bucketName：阿里云bucketName的名称

　　file：文件流

timestamp()根据年月日时分秒生产文件名
------------------------------------------------------------------------------

  region：“xxx” //oss区域

　　accessKeySecret：连接阿里云的accessKeyScret

　　dir：文件夹的名称

　　bucket：阿里云oss的名称

3、走2次才算上传成功

       

　　　

 4、走2次才算上传成功

 　　　

　　　　

5、地址贴出来可访问