重庆小潘seo博客

当前位置:首页 > 重庆网络营销 > 小潘杂谈 >

小潘杂谈

微信小程序开发登录验证功能

时间:2020-09-07 17:00:09 作者:重庆seo小潘 来源:
本篇文章介绍了微信小程序开发登录验证功能的方法,希望对学习小程序开发的朋友有帮助! 微信小程序开发登录验证功能 需求描述: 对于部分页面添加登录验证,用户未登录的情况下,进入页面,页面自动转向登录页面。登录验证成功后,回调到登录发起页面。 推

本篇文章介绍了微信小程序开发登录验证功能的方法,希望对学习小程序开发的朋友有帮助!

微信小程序开发登录验证功能

微信小程序开发登录验证功能

需求描述:

对于部分页面添加登录验证,用户未登录的情况下,进入页面,页面自动转向登录页面。登录验证成功后,回调到登录发起页面。

推荐学习:小程序开发

实现思路:

创建全局变量用于存储当前登录用户对象(userInfo)、全局方法用于验证登录有效性(checkLoginInfo())、全局方法用于获取当前页面的全路径(getCurrentUrl())。

针对需要添加登录限制的页面page.onLoad事件,调用checkLoginInfo()方法,判断当前登录状态。如未登录,页面转向登录页面。

登录验证通过后,将登录信息存储到全局变量userInfo,跳转回登录发起页面。

关键代码及注意事项:

app.jsdata:{userInfo:null,//用户登录存储对象loginUrl:../login/login,},checkLoginInfo:function(url){//验证登录状态if(this.data.userInfo==null){return url;}else{return ;}},getCurrentUrl:function(){//获取当前页面全路径var url=getCurrentPages()[getCurrentPages().length-1].__route__;url=url.replace(eapdomain/src/pages,..);//替换路径全路径。修改该路径为相对路径return url;}注意:在getCurrentUrl方法中,最后返回url时,又调用了replace方法。因为wx.redirectTo的url参数要求为相对路径。所以在这里转换了一下。

login.jsvar app=getApp();Page({data:{backUrl:null,loginName:null,passWord:null},onLoad:function(options){this.setData({backUrl:null});// 页面初始化 options为页面跳转所带来的参数//console.log(options.backUrl);this.setData({backUrl:options.backUrl});},inputClick:function(event){//动态 对 paga.data 进行赋值//id与 数据项 一一对应var objId=event.currentTarget.id;var paraObj={};paraObj[objId]=event.detail.value;this.setData(paraObj);//console.log(event.currentTarget.id);//console.log(this.data);},onReady:function(){// 页面渲染完成},onShow:function(){// 页面显示},onHide:function(){// 页面隐藏},onUnload:function(){// 页面关闭},loginClick:function(){var loginName=this.data.loginName;var passWord=this.data.passWord;if(loginName!=null&&passWord!=null){var backUrl=this.data.backUrl;// wx.redirectTo({//url:'eapdomain/src/pages/pageCreate/pageCreate'// })app.data.userInfo={loginName:loginName,passWord:passWord};wx.redirectTo({url: backUrl});//wx.redirectTo({// //目的页面地址//url: 'pages/logs/index',//success: function(res){},//})}else{this.setData({loginName:null,passWord:null});}}})这里inputClick事件。根据前台控件id为page.data数据进行赋值。

PHP中文网,大量thinkphp教程,欢迎学习!以上就是微信小程序开发登录验证功能的详细内容,更多请关注小潘博客其它相关文章!