微信小程序实现登录功能
文章目录前言一、小程序登录的API2.做缓存维持登录状态退出登录总结前言提示:这里可以添加本文要记录的大概内容:例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。提示:以下是本篇文章正文内容,下面案例可供参考一、小程序登录的API获取用户信息。// 必须是在用户已经授权的情况下调用wx.getUserInfo({success:
·
文章目录
前言
提示:这里可以添加本文要记录的大概内容:
例如:随着人工智能的不断发展,机器学习这门技术也越来越重要,很多人都开启了学习机器学习,本文就介绍了机器学习的基础内容。
提示:以下是本篇文章正文内容,下面案例可供参考
一、小程序登录的API
获取用户信息。
// 必须是在用户已经授权的情况下调用
wx.getUserInfo({
success: function(res) {
var userInfo = res.userInfo
var nickName = userInfo.nickName
var avatarUrl = userInfo.avatarUrl
var gender = userInfo.gender //性别 0:未知、1:男、2:女
var province = userInfo.province
var city = userInfo.city
var country = userInfo.country
}
})
会弹出授权(官方要求)
然后获取到的内容给页面的data
2.做缓存维持登录状态
login(){
wx.getUserProfile({
desc: '必须授权登录才可以使用',
success: res=>{
let user = res.userInfo
wx.setStorageSync('user', user)
this.setData({
//也可以直接写到wxml里面 这就是另一种登录方式
nickName:res.userInfo.nickName,
touxiang:res.userInfo.avatarUrl,
login:false //记录登录的状态
})
wx.setStorage({
key:"nologin",
data:"false"
})//将登录状态在缓存中放一份
},
fail: res=>{
console.log('授权失败',res)
}
})
},
Onload生命周期:只在第一次创建页面时执行
退出登录
我的做法主要时结合了缓存
tuichu:function(){
let that = this
wx.showModal({
title: '提示',
content: '是否退出登录',
success (res) {
if (res.confirm) {
wx.removeStorageSync('user')
wx.removeStorageSync('nologin')//移除这两个缓存也就退出了登录
that.setData({
login:true
})
console.log('用户点击确定')
} else if (res.cancel) {
console.log('用户点击取消')
}
}
})
},
如果没登录就隐藏模块
<view class="btn" bindtap="login" wx:if="{{login}}">登录</view>
总结
总结:需要做对登录状态的判断 避免重复调用函数来登录 也是保存下登录的状态 保证在自己不主动退出登录的情况下 一直保持登录状态
实现方式 将获取到的信息顺带储存到缓存中(但是微信缓存满10M会自动清理缓存 这种情况还未遇到过 知道的可以告知 多谢)
更多推荐



所有评论(0)