前端项目,基于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
完。