靠近阿里云---图片上传(1)

前端项目,基于vue框架实现阿里云图片上传(单张)

1.安装依赖包

npm install ali-oss

2.编写alioss.js

var OSS = require('ali-oss')
export function client() {
    var client = new OSS({
        region: 'oss-cn-beijing',
        accessKeyId: 'LTAIDZ8c2xxx',
        accessKeySecret: 'yXOfrXPiuywxxxxx',
        bucket: 'judian-image'
    }) //后端提供数据
    return client
}

3.直接使用

import { client } from 'utils/alioss'
...
methods: {
    // 使用vant的<van-uploader ...:after-read="onReadImg">
    onReadImg(file) {
        this.hrefObj.link_img = file.content
        file = file.file
        var fileName = `${new Date().getTime()}href_${file.name}`
        // ali oss直传
        client().put(fileName, file).then(
              result => {
                   console.log(result)
                   this.hrefObj.link_img = result.url
        })
   }
}

2018-10-24
完。

    原文作者:Judian
    原文地址: https://segmentfault.com/a/1190000016789190
    本文转自网络文章,转载此文章仅为分享知识,如有侵权,请联系博主进行删除。
点赞