Fonction de vérification de connexion au développement de l'applet WeChat

angryTom
Libérer: 2020-03-23 13:43:10
avant
4612 Les gens l'ont consulté

Cet article présente la méthode de développement de la fonction de vérification de connexion dans le mini-programme WeChat. J'espère qu'il sera utile aux amis qui apprennent le développement de mini-programmes !

Fonction de vérification de connexion au développement de l'applet WeChat

Fonction de vérification de la connexion au développement de l'applet WeChat

Description de l'exigence :

Pour certaines pages à ajouter Vérification de la connexion, si l'utilisateur n'est pas connecté et entre dans la page, la page sera automatiquement redirigée vers la page de connexion. Une fois la vérification de la connexion réussie, revenez à la page d'initiation de connexion.

Apprentissage recommandé : Développement de mini-programmes

Idées de mise en œuvre :

Créer des variables globales pour stocker l'objet utilisateur actuellement connecté (userInfo) et les méthodes globales Utilisée pour vérifier la validité de la connexion (checkLoginInfo()), méthode globale utilisée pour obtenir le chemin complet de la page actuelle (getCurrentUrl()).

Pour l'événement page.onLoad de la page où des restrictions de connexion doivent être ajoutées, appelez la méthode checkLoginInfo() pour déterminer l'état de connexion actuel. Si vous n'êtes pas connecté, la page sera redirigée vers la page de connexion.

Une fois la vérification de connexion réussie, les informations de connexion sont stockées dans la variable globale userInfo et reviennent à la page d'initiation de connexion.

Codes clés et notes :

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;
}
Copier après la connexion

Remarque : Dans la méthode getCurrentUrl, lorsque l'URL est finalement renvoyée, la méthode de remplacement est appelée. Parce que le paramètre url de wx.redirectTo nécessite un chemin relatif. Je l'ai donc converti ici.

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
            });
        }
    }
})
Copier après la connexion

Événement InputClick ici. Attribuez des valeurs aux données page.data en fonction de l'identifiant du contrôle frontal.

Site Web PHP chinois, un grand nombre de tutoriels thinkphp, bienvenue pour apprendre !

Ce qui précède est le contenu détaillé de. pour plus d'informations, suivez d'autres articles connexes sur le site Web de PHP en chinois!

Étiquettes associées:
source:zixun.jisuapp.cn
Déclaration de ce site Web
Le contenu de cet article est volontairement contribué par les internautes et les droits d'auteur appartiennent à l'auteur original. Ce site n'assume aucune responsabilité légale correspondante. Si vous trouvez un contenu suspecté de plagiat ou de contrefaçon, veuillez contacter admin@php.cn
Tutoriels populaires
Plus>
Derniers téléchargements
Plus>
effets Web
Code source du site Web
Matériel du site Web
Modèle frontal
À propos de nous Clause de non-responsabilité Sitemap
Site Web PHP chinois:Formation PHP en ligne sur le bien-être public,Aidez les apprenants PHP à grandir rapidement!