微信小程序非跳转式组件授权登录的方法示例(2)

监听token的用意为:token是服务器返回当前用户的访问凭证,凭证有过期的时候这时候所有的网络请求将无法访问,所以用了一个愚蠢的方法来监听token

//监听登录状态 WatchIsLogin:function(){ this.data.cloneIner=setInterval(function(){ //防止死循环,超过错误次数终止监听 if (this.getErrorCount()) return clearInterval(this.data.clearInterval); if (app.globalData.token == '') this.setAuthStatus(); }.bind(this),800); this.setData({ cloneIner:this.data.cloneIner}); } /** * 处理错误次数,防止死循环 * */ setErrorCount:function(){ if (!this.data.ErrorCount) this.data.ErrorCount=1; else this.data.ErrorCount++; this.setData({ ErrorCount: this.data.ErrorCount}); }, /** * 获取错误次数,是否终止监听 * */ getErrorCount:function(){ return this.data.ErrorCount >= 10 ? true : false; }

以上就是组件内全部的方法需要在组件生命周期函数内调用第一步的方法检测授权,执行登录

attached(){ this.setAuthStatus(); }

注:在网络请求中一定要处理token失效的操作,主要把 app.globalData.token和app.globalData.isLog 设置回空和false

这里附上没有定义的一些app内公用的快捷方法以下的方法最好是写在其他文件里面在app.js里面写一个快捷调用的方法

/* * post网络请求 * @param string | object 请求地址 * @param object data POST请求数组 * @param callable successCallback 成功执行方法 * @param callable errorCallback 失败执行方法 */ const basePost = function (url, data, successCallback, errorCallback, header) { if (typeof url == 'object') url = U(url); wx.request({ url: url, data: data, dataType : 'json', method: 'POST', header: header, success: function (res) { try{ if (res.data.code == 200) { successCallback && successCallback(res.data); } else { if (res.data.code == 402) getApp().globalData.token = '', getApp().globalData.isLog = false; //返回状态为401时,用户被禁止访问 关闭当前所有页面跳转至用户禁止登录页面 if (res.data.code == 401) return Tips({ title: res.data.msg}, { tab: 4, url:'/pages/login-status/login-status'}); errorCallback && errorCallback(res.data); } } catch (e) { console.log(e); } }, fail: function (res) { errorCallback && errorCallback(res); }, complete: function (res) { } }); } /* * 组装URl *@param object opt */ const U = function (opt, url) { var m = opt.m || 'routine_two', c = opt.c || 'auth_api', a = opt.a || 'index', q = opt.q || '', p = opt.p || {}, params = '', gets = ''; if (url == undefined) url=getApp().globalData.url; params = Object.keys(p).map(function (key) { return key + 'https://www.jb51.net/' + p[key]; }).join('https://www.jb51.net/'); gets = Object.keys(q).map(function (key) { return key + '=' + q[key]; }).join('&'); return url + 'https://www.jb51.net/' + m + 'https://www.jb51.net/' + c + 'https://www.jb51.net/' + a + (params == '' ? '' : 'https://www.jb51.net/' + params) +'.html'+ (gets == '' ? '' : '?' + gets); }

代码量有点多,都是能用到的,望大神们多多指点

本小程序后台框架由 提供

TP5+EasyWeChat技术支持

如果对微信小程序授权不熟悉的可以用 EasyWeChat,确实好用;不是来吹这个EasyWeChat来了,只是个人觉得好用勿喷

内容版权声明:除非注明,否则皆为本站原创文章。

转载注明出处:http://www.heiqu.com/42bce83ef1cbc51f64d7593be28ab94c.html