阿里云授权
const client = new OSS({
accessKeyId: "******",
accessKeySecret: "********",
bucket: "***",
endpoint: "域名",
region: "**",
secure: true
});
1、授权微信
Vue history 路由模式授权微信需要接口地址后面直接拼接encodeURIComponent(location.herf)
Vue hash 路由模式授权微信需要在接口地址后面进行encodeURIComponent(location.href.split('#')[0])否则会出现你在开发者工具里面什么都是好用的，但是到了真机测试的时候就全是羊驼了。。。
授权接口方法
getWxsdk({}).then((res)=>{
if(res.code == 200 ){
this.$wechat.config({
debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
appId: res.data.appId, // 必填，公众号的唯一标识
timestamp: parseInt(res.data.timestamp), // 必填，生成签名的时间戳
nonceStr: res.data.nonceStr, // 必填
signature: res.data.signature, // 必填
jsApiList:res.data.jsApiList
})
}
})
// 选择图片
chooseImage(){
let self = this;
self.$wechat.chooseImage({
count: 9, // 默认9
sizeType: ['original', 'compressed'], // 可以指定是原图还是压缩图，默认二者都有
sourceType: ['album', 'camera'], // 可以指定来源是相册还是相机，默认二者都有
success(res) {
self.localIds = res.localIds; // 返回选定照片的本地ID列表，localId可以作为img标签的src属性显示图片
self.syncUpload(self.localIds);
}
});
},
如何前端直接上传阿里云
syncUpload(localIds){
let newlocalId = localIds.pop();
var self = this;
//获取图片
self.$wechat.getLocalImgData({
localId: newlocalId, // 图片的localID
success: (res)=> {
var localData = res.localData; // localData是图片的base64数据，可以用img标签显示
if(localData.indexOf('data:image'!==0)){
localData = 'data:image/jpeg;base64,'+ localData
}
localData = localData.replace(/\r|\n/g,'').replace('data:image/jpg', 'data:image/jpeg');
const blob = this.dataURLtoBlob(localData);
// blob转arrayBuffer
const reader = new FileReader();
reader.readAsArrayBuffer(blob);
reader.onload = event => {
// arrayBuffer转Buffer
const buffer = self.toBuffer(event.target.result);
client.put(`recordentry/${Math.random()*10}xixi.png`, buffer).then(response => {
if(response.res.status === 200){
self.imgListArr.push(response.res.requestUrls[0]);
}else{
self.$toast('上传失败，请重新上传');
}
})
.catch(err => {
console.log(err);
});
}
if(localIds.length > 0){
self.syncUpload(localIds);
}
}
})
},
//ArrayBuffer ---> Buffer
toBuffer(ab) {
var buf = new Buffer(ab.byteLength);
var view = new Uint8Array(ab);
for (var i = 0; i < buf.length; ++i) {
buf[i] = view[i];
}
return buf;
},
// 判断机型
IsAndroid() {
var u = navigator.userAgent;
var isandroid = u.toLocaleLowerCase().indexOf('android') > -1 || u.toLocaleLowerCase().indexOf('adr') > -1;
if (isandroid) {
return true;//android(安卓手机）
} else {
return false;//ios（苹果手机）
}
},
// base64转blob
dataURLtoBlob(dataurl) {
var arr = dataurl.split(',');
var mime = arr[0].match(/:(.*?);/)[1];
if(this.IsAndroid()){
var newImg = arr[1].replace(/^data:image\/(png|jpeg|jpg);base64,/,'');//一定要判断系统类型、一定要判断系统类型、一定要判断系统类型
var bstr = atob(newImg);
}else{
var bstr = atob(arr[2]);
}
var n = bstr.length;
var u8arr = new Uint8Array(n);
while (n--) {
u8arr[n] = bstr.charCodeAt(n);
}
return new Blob([u8arr], { type: mime });
},