前言
上周接了一个小项目赚点外快,原以为很简单结果被卡在一个小坑爬了好半天
它是一个供电力局使用的报修小程序,需要特定用户在第一次使用时进行激活操作,通俗的说就是当某用户打开时,判断此用户是否激活过,若未激活则进入激活页面,若已经激活则直接进入首页面。
逻辑上很简单,但是在实现上碰到坑了。
上图为已激活用户或不需要激活的用户打开小程序后进入的第一个页面,下图为未激活用户打开小程序后进入的第一个页面。
思考过程
"pages": [ "pages/index/index", "pages/active/active", "pages/index/add", "pages/my/my", "pages/mylist/mylist", "pages/home/home", "pages/rating/rating", "pages/login/mylogin", "pages/login/login", "pages/detail/detail", "pages/mylist/list", "pages/mylist/mydetail" ],
而在app.json中必须引入全部的页面,且第一个引入的页面为首页面。
但是判断逻辑必须要在用户一打开小程序后就进行,但事实是必须先打开index页面(即上图),所以按照微信小程序的生命周期,我首先想到的办法是将判断逻辑写在index页的onload函数中。
在加载过程中进行判断,从而跳转。
var currentUser = Bmob.User.current(); var currentUserId = currentUser.id; var User = Bmob.Object.extend("_User"); var queryUser = new Bmob.Query(User); queryUser.get(currentUserId, { success: function (result) { console.log(result) var status = result.attributes.status; var usertype = result.attributes.usertype; if (status==null&& usertype == 1) { wx.navigateTo({ url: '/pages/active/active?lineid=' + lineid }) } }, error: function (object, error) { } });
以上代码就是我写入onload中的判断逻辑,先获取当前用户的id,从而进入数据库查询,获取此用户的status状态和userType类型,只有status为false且userType为1时,才进行跳转激活。
但是实际在测试时发现一个始料未及被忽视的问题。
wx.login({ success: function (res) { user.loginWithWeapp(res.code).then(function (user) { var openid = user.get("authData").weapp.openid; console.log(user, 'user', user.id, res); if (user.get("nickName")) { // 第二次访问 console.log(user.get("nickName"), 'res.get("nickName")'); var currentUser = Bmob.User.current(); var currentUserId = currentUser.id; var User = Bmob.Object.extend("_User"); var queryUser = new Bmob.Query(User); queryUser.get(currentUserId, { success: function (result) { var status = result.attributes.status; var usertype = result.attributes.usertype; console.log(status); }, error: function (object, error) { console.log(result); } }); } else { wx.setStorageSync('status', false), wx.setStorageSync('usertype', 1), //保存用户其他信息 wx.getUserInfo({ success: function (result) { var userInfo = result.userInfo; var nickName = userInfo.nickName; var avatarUrl = userInfo.avatarUrl; var u = Bmob.Object.extend("_User"); var query = new Bmob.Query(u); // 这个 id 是要修改条目的 id,你在生成这个存储并成功时可以获取到,请看前面的文档 query.get(user.id, { success: function (result) { // 自动绑定之前的账号 result.set('nickName', nickName); result.set("userPic", avatarUrl); result.set("openid", openid); result.set("isbind", 0); result.set("status", false); result.set("usertype", 1); result.save(); } }); wx.setStorageSync('openid', openid) wx.setStorageSync('username', user.get("username")) wx.setStorageSync('userpic', avatarUrl) wx.setStorageSync('nickname', nickName) } }); } }, function (err) { console.log(err, 'errr'); }); } });
因为我在app.js中进行了微信登录,即获取到了用户授权信息后,将用户的微信名、头像以及初始化的userType和status写入数据库中。以上为此逻辑的代码。
故在用户授权前,数据库中此用户的userType和status是空的,而这时候按照微信小程序的生命周期,第一个首页面已经加载完毕并显示,即onload在判断时,此用户的userType和status状态为空,则认为此用户无需激活。而用户点完授权后,即使存入正确的userType和status已经于事无补。
用户第一次打开小程序,可见此时页面已经加载完毕,但是用户还未授权微信登录
而这时候的用户数据均为空
用户点击确定授权后才会写入数据,但这时候页面的onload早已执行完毕
只能再寻找其它的解决办法。
解决过程
总结了一下刚才失败的原因,是因为在执行onload时,逻辑判断语句并没有取到正确的参数。所以要想办法在onload函数执行前,就传入正确的参数。
于是尝试另外一种方法,使用本地缓存进行传值判断。
即用户在一打开小程序加载app.js时,先在本地缓存中将用户的userType和status值存入,然后在index页面的onLoad函数中使用判断,这样就不存在微信登录授权的时间差。
于是需要在用户第一次使用时进行初始化参数并存入缓存以供onload函数判断,而用户如果不是第一次使用,则直接从数据库中查找到此用户并将此用户的userType和status取出存入本地缓存,供onLoad函数判断。
于是首先在app.js中加入以下两行代码进行新用户初始化缓存存入
wx.setStorageSync('status', false), wx.setStorageSync('usertype', 1),
加入以下两行代码进行老用户获取参数进行缓存存入
queryUser.get(currentUserId, { success: function (result) { var status = result.attributes.status; var usertype = result.attributes.usertype; wx.setStorageSync('status', status) wx.setStorageSync('usertype', usertype) console.log(status); }, error: function (object, error) { console.log(result); } });
然后在index的onload函数中写入以下逻辑,进行判断。
var status = wx.getStorageSync('status') var usertype = wx.getStorageSync('usertype') // console.log(usertype) if (!status &&!usertype) { wx.navigateTo({ url: '/pages/active/active?lineid=' + lineid }) } else if (status ==false && usertype == 1) { wx.navigateTo({ url: '/pages/active/active?lineid=' + lineid }) }
这里要注意,因为考虑到了缓存溢出的情况,多加了判断status和userType非空的操作。
于是至此这个坑被完美的填了,从入坑到找坑到爬坑耗时两小时。
总结
还是像上一篇文章说的,这是一个填坑的过程,第一个吃螃蟹的人不光要被夹,还得告诉后人怎么撬开螃蟹壳。
以上所述是小编给大家介绍的小程序实现新用户判断并跳转激活的方法详解整合,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对小牛知识库网站的支持!
本文向大家介绍如何实现小程序与小程序之间的跳转,包括了如何实现小程序与小程序之间的跳转的使用技巧和注意事项,需要的朋友参考一下 前言 小程序与小程序之间互相可以跳转,形成流量的循环.在小程序中怎么实现的呢 小程序中提供了两种方式实现小程序与小程序之间的跳转 方式1-使用 API 方式跳转 如下示例代码所示 如下是逻辑代码 使用小程序跳转的 API 就上面几行代码 方式2-使用标签方式跳转 如下是w
小程序跳转小程序 产品简介 开发者可以通过以下接口帮助用户在小程序之间互相跳转。 使用场景 当开发者拥有多个小程序时,可以通过小程序间互相跳转,完善小程序生态。 开放标准 对所有入驻小程序的企业开放。 打开指定的小程序 开发者可以使用jd.navigateToMiniProgram(OBJECT),打开指定的小程序,帮助用户在小程序之间跳转。 OBJECT 参数说明: 参数名 类型 必填 说明 a
本文向大家介绍微信小程序 判断手机号的实现代码,包括了微信小程序 判断手机号的实现代码的使用技巧和注意事项,需要的朋友参考一下 微信小程序 判断是否是手机号 JS实现代码: 感谢阅读,希望能帮助到大家,谢谢大家对本站的支持!
本文向大家介绍js判断登录与否并确定跳转页面的方法,包括了js判断登录与否并确定跳转页面的方法的使用技巧和注意事项,需要的朋友参考一下 本文实例讲述了js判断登录与否并确定跳转页面的方法。分享给大家供大家参考。具体如下: 使用session存储,确定用户是否登录,从而确定页面跳转至哪个页面。 判断本地有无customerID: html中,相应的a标签中,写onclick="infoJumpTo"
本文向大家介绍JSP中实现判断客户端手机类型并跳转到app下载页面,包括了JSP中实现判断客户端手机类型并跳转到app下载页面的使用技巧和注意事项,需要的朋友参考一下 判断客户端手机类型,并跳转到相应的app下载页面 实现的原理,是检测浏览器的 USER-AGENT 这个header,然后根据正则表达式来确定客户端类型。 如果都不匹配,Fallback回退策略是显示对应的页面,让用户自己选择。 适
本文向大家介绍Android应用程序转到后台并回到前台判断方法,包括了Android应用程序转到后台并回到前台判断方法的使用技巧和注意事项,需要的朋友参考一下 我们知道,当我们按返回或Home键退出应用程序的界面时,应用程序会在后台被挂起。这么设计的好处是,由于应用被系统缓存在内存中,那么在用户打开启动应用时就可以通过调用缓存,快速启动应用。当然,由于当今内存和处理器能力的限制,系统会自动关闭一些