Vue 2.0中如何对接七牛云，而且不用引入七牛的各种插件

myFileOnChange : function ( e) { // 这里是你的input file 的onchange事件

const file = e. srcElement. files[ 0] // 获取到你选择的图片

const imgURL = window. URL. createObjectURL( file) // 保存你选择图片的本地路径

// 一般咱们选择图片后会先让图片在img标签里显示一下，这里你可以先用这个路径，没有问题

let d = new Date()

let type = file. name. split( '.')

this. tokenParem = {

'putPolicy' : '{ \' name \' : \' $(fname) \' , \' size \' : \' $(fsize) \' , \' w \' : \' $(imageInfo.width) \' , \' h \' : \' $(imageInfo.height) \' , \' hash \' : \' $(etag) \' }',

'key' : 'orderReview/' + d. getFullYear() + '/' + ( d. getMonth() + 1) + '/' + d. getDate() + '/' + d. valueOf() + '.' + type[ type. length - 1],

'bucket' : 'http://p3zcd9obi.bkt.clouddn.com' // 七牛的地址，这个是你自己配置的（变量）你要上传到的七牛地址

}

this. param = new FormData() // 创建form对象

this. param. append( 'chunk', '0') // 断点传输

this. param. append( 'chunks', '1')

this. param. append( 'file', file, file. name)

this. $http. post( 'http://copyrigh' // 这里的路径是你获取七牛token的请求路径). then( res => {

this. qiniutoken = res. data. token // 在data里定义qiniutoken

console. log( res. data. token)

this. param. append( 'token', this. qiniutoken)

this. uploading( this. param, file. name) // 然后将参数上传七牛，这里的uploading事件需要定义在data里，

})

}

uploading : function ( param, config, pathName) { // 定义在data里的uploading函数

this. $http. post( 'http://upload.qiniu.com/', param)

. then( response => {

console. log( response. body. key) // 这个key是你上传图片成功后七牛返回给你的图片key

var key = response. body. key

this. myHeadImg = 'http:' + key // 然后这里做一下路径的字符串拼接 前面的路径是你七牛的地址

})

}