靠近阿里雲---圖片上傳（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
完。