vue使用阿里oss上传

1、首先用包管理工具 npm install ali-oss --S 下载oss依赖包

2、在util文件里创建util.js文件，在该文件写入

export default {

getClient: function() {
// let OSS = require('ali-oss')
let OSS = require('ali-oss/dist/aliyun-oss-sdk.min.js')
return new OSS({
region: 'oss-cn-shanghai', //你的oss地址 ，具体位置见下图
accessKeyId: 'xxx', //你的ak
accessKeySecret: 'xxx', //你的secret
bucket: 'xxx' //你的oss名字
})
},
}

3、在main.js文件里写入：

import utils from './static/utils/index.js'
Vue.prototype.$utils= utils

4、在页面使用

            uploadMa() {
                (function() {
                    return new Promise((resolve, reject) => {
                        uni.chooseImage({
                            count: 1,
                            success(res) {
                                resolve(res.tempFiles)
                            },
                            fail(err) {
                                console.log(err)
                                reject(err)
                            }
                        })
                    })
                })().then(filesArr => {
                    const thisSelf = this;
                    const client = thisSelf.$utils.getClient();
                    let arr = [];
                    uni.showLoading({
                        title: '上传中...'
                    });
                    for (let i = 0; i < filesArr.length; i++) {
                        var datetoday = thisSelf.$utils.getTodayDate();
                        var randomStr = "/" + new Date().getTime() + thisSelf.$utils.randomString(4); //  4位随机字符串
                        var extensionName = filesArr[i].name.substr(filesArr[i].name.lastIndexOf(".")); // 文件扩展名
                        var fileName = "image/" + datetoday + randomStr + extensionName; // 文件名字（相对于根目录的路径 + 文件名）

                        client.multipartUpload(fileName, filesArr[i]).then(function(result) {
                            arr.push(result.res.requestUrls[0].split('?')[0])
                            if (arr.length === filesArr.length) {
                                uni.hideLoading();
                                thisSelf.platformPicture = arr[0]
                                console.log(arr[0])
                            }
                        })
                    }
                })
            },

5、至此已完成

 

标签：arr,vue,oss,thisSelf,js,filesArr,上传,utils
来源： https://www.cnblogs.com/yxg2852/p/16281680.html