WeChat applet development login verification function

This article introduces the method of developing login verification function in WeChat mini program. I hope it will be helpful to friends who are learning mini program development!

WeChat applet development login verification function

Requirement description:

Add for some pages Login verification, if the user is not logged in, and enters the page, the page will automatically redirect to the login page. After the login verification is successful, call back to the login initiation page.

Recommended learning: Small program development

Implementation ideas:

Create global variables to store the currently logged in user object (userInfo) and global methods Used to verify login validity (checkLoginInfo()), global method used to obtain the full path of the current page (getCurrentUrl()).

For the page.onLoad event of the page where login restrictions need to be added, call the checkLoginInfo() method to determine the current login status. If you are not logged in, the page will redirect to the login page.

After the login verification is passed, the login information is stored in the global variable userInfo and jumps back to the login initiation page.

Key code and precautions:

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;
}

Note: In the getCurrentUrl method, when the url is finally returned, the replace method is called. Because the url parameter of wx.redirectTo requires a relative path. So I converted it here.

login.js

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 event here. Assign values ​​to page.data data based on the front control id.

PHP Chinese website, a large number of thinkphp tutorials, welcome to learn!

The above is the detailed content of WeChat applet development login verification function. For more information, please follow other related articles on the PHP Chinese website!