自从官方说改了授权接口之后,花了不少时间研究这个东西,也查了不少资料,也得到过不少人的指点,今天终于实现了效果,终究是自己第一次完成了这么个功能,不知道代码有没有问题,请大师给参考下。另外就是头像URL和数据库中的URL不一样,是不是要自己重新设置存储URL?
login文件代码:
wxml代码:
<form catchsubmit="formSubmit">
<button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
<image class="avatar" src="{{avatarUrl}}"></image>
</button>
<view class="row">
<view class="text">用户名</view>
<input type="nickname" class="weui-input" placeholder="请输入昵称"/>
</view>
<button class="for-button" type="primary" formType="submit">授权</button>
</form>
js代码:
const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'
const db = wx.cloud.database();
const app=getApp();
Page({
/**
* 页面的初始数据
*/
data: {
avatarUrl: defaultAvatarUrl,
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
},
onChooseAvatar(e) {
// console.log(e);
const { avatarUrl } = e.detail
this.setData({
avatarUrl,
})
},
formSubmit(e){
wx.login({
success (res) {
// console.log(res);
const code=res.code;
if (code) {
app.setcode(code);
db.collection("user").add({
data:{
code: res.code,
avatarUrl:defaultAvatarUrl,
}
})
wx.showToast({
title:"恭喜!授权成功!"
});
setTimeout(()=>{
wx.navigateBack({});
},1500)
}
else {
console.log('登录失败!' + res.errMsg)
}
}
})
},
app.js代码:
//app.js
App({
onLaunch: function () {
if(!wx.cloud){
console.error('请使用2.2.3或以上的基础库以使用云能力')
}else{
wx.cloud.init({
traceUser:true,
})
}
// 展示本地存储能力
const logs = wx.getStorageSync('logs') || []
logs.unshift(Date.now())
wx.setStorageSync('logs', logs)
this.globalData={}
this.loadcode();
},
//判断是否已经授权
loadcode:function(){
const that=this;
wx.getSetting({
success:res=>{
const iscode=res.authSetting['scope.code'];
if(iscode){
wx.code({
success:res=>{
const code=res.code;
that.globalData.code=code;
}
})
}
}
})
},
//用户授权
is_login: function(){
if(this.globalData.code){
return true;
}else{
return false;
}
},
setcode:function(code){
this.globalData.code=code;
},
})
