微信小程序开发登录验证功能-9543建站博客

广告：宝塔Linux面板高效运维的服务器管理软件点击【 https://www.bt.cn/p/uNLv1L 】立即购买

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

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

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

需求描述：

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

推荐学习：小程序开发

实现思路：

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

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

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

关键代码及注意事项：

app.js

data:{    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参数要求为相对路径。所以在这里转换了一下。

var 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教程，欢迎学习！

以上就是微信小程序开发登录验证功能的详细内容，更多请关注9543建站博客其它相关文章！

广告：SSL证书一年128.66元起，点击购买~~~