小程序获取用户信息弹窗
/pages/user/index.wxml
<view class="container">
<view class="userinfo">
<block wx:if="{{!hasUserInfo}}">
<l-button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 获取头像昵称 </l-button>
<button wx:else open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 获取头像昵称 </button>
</block>
<block wx:else>
<text class="userinfo-nickname">{{userInfo.userName}}</text>
</block>
</view>
</view>
/pages/user/index.js
Page({
data: {
userInfo: {},
hasUserInfo: false,
canIUseGetUserProfile: true,
},
/**
* 生命周期函数--监听页面加载
*/
onLoad: function (options) {
let token = wx.getStorageSync('token')
let userInfo = wx.getStorageSync('userInfo')
if (token) {
this.setData({
canIUseGetUserProfile: true,
})
if (userInfo) {
this.setData({
hasUserInfo: true,
userInfo: userInfo
})
}
}
},
getUserProfile(e) {
let resUserInfo = {}
// 推荐使用wx.getUserProfile获取用户信息,开发者每次通过该接口获取用户个人信息均需用户确认
// 开发者妥善保管用户快速填写的头像昵称,避免重复弹窗
wx.getUserProfile({
desc: '用于绑定个人房源信息', // 声明获取用户个人信息后的用途,后续会展示在弹窗中,请谨慎填写
success: (res) => {
this.setData({
userInfo: res.userInfo,
hasUserInfo: true
})
resUserInfo.iv = res.iv
resUserInfo.encryptedData = res.encryptedData
// 获取用户登录
wx.login({
success(res) {
if (res.code) {
resUserInfo.wxCode = res.code
console.log('登录成功' + JSON.stringify(res))
// 发起网络请求
wx.request({
url: app.globalData.URL + 'auth/wxlogin',
method: 'POST',
header: {
'content-type': 'application/json;charset=UTF-8'
},
data: resUserInfo,
success: (res) => {
// 本地缓存token
wx.setStorageSync('token', res.data.data.token)
// 保存用户信息
wx.setStorageSync('userInfo', res.data.data.userInfo)
}
})
} else {
console.log('登录失败!' + res.errMsg)
}
}
})
}
})
},
resUserInfo.iv是用来用来获取用户的加密信息数据的,例如性别、地区等。
未完待续...