华少建站开发微信公众号
我们网络微博
咨询热线:13590470703
咨询邮箱:136977743@qq.com
小程序开发定制就找华少开发定制
您的位置:主页 > 建站资讯 > 小程序开发 > > 查看内容
微信小程序开发登录验证实现教程
发表日期:2018-08-29 22:35    文章编辑:网站建设    文章来源:中山网站建设    浏览次数:
  需求描述:
 
  对于部分页面添加登录验证,用户未登录的情况下,进入页面,页面自动转向登录页面。登录验证成功后,回调到登录发起页面。
 
  实现思路:
 
  创建全局变量用于存储当前登录用户对象(userInfo)、全局方法用于验证登录有效性(checkLoginInfo())、全局方法用于获取当前页面的全路径(getCurrentUrl())。
 
  针对需要添加登录限制的页面page.onLoad事件,调用checkLoginInfo()方法,判断当前登录状态。如未登录,页面转向登录页面。
 
  width=600
 
  登录验证通过后,将登录信息存储到全局变量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参数要求为相对路径。所以在这里转换了一下。
 
  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事件。根据前台控件id为page.data数据进行赋值。
 
  1.   
如没有注明,文章为网络原创,转载时请注明来源 http://www.ssyr168.com/articlekf/96.html
新闻分类

关于我们

华少开发定制专注深圳小程序开发,以良好的定制服务和小程序开发技术经验,做好小程序开发行业品牌。我们的服务宗旨是:"用良心做好小程序,用实力做好服务!"

联系我们

  • 地址: 深圳市南山区珠光路52号
  • 电话: 13590470703
  • Email: 136977743@qq.com
扫描二维码 关注我们官方微信 解决小程序开发问题
小程序开发热线

13590470703

周一至周六9:00-18:00

售后服务 / 投诉处理

主营业务: 深圳小程序公司 深圳小程序开发 深圳小程序制作 深圳小程序外包 深圳小程序定制 深圳小程序设计

Powered by Ssyr168 © 2014-2019 www.ssyr168.com .  华少开发定制 版权所有    | 粤ICP备16039892号