微信小程序开发—从零开始,登录没有session ,cookie的解决方法的尝试,同步异步,解决,

  • Post author:
  • Post category:小程序


背景:接到领导要求开发一个微信小程序,客户需要,经过一个礼拜左右的时间,基本算是可用状态


重难点:没有session ,cookie之类的,用来存储网站全局的,登录用户信息,


官方推荐是用wx.setStorageAysc()即将登录后的用户信息存储到本地数据缓存,


但是有个bug,有些机型会莫名其妙丢失缓存,即丢失自动登录信息,相见官方社区:


https://developers.weixin.qq.com/community/develop/doc/000c6e85794ac04b73b81364851000

稳妥起见,个人解决方法:

在程序启动或是进入前台时,检测能否获取到值,即是否失效,

失效重新请求获取登录相关信息,个人为了保险起见,又设置全局变量,双重保障存放,

登录用户的个人信息,代码见第二步:小白

ps进入前台,即打开小程序界面,

有图有真相


针对小白请看第一步,否则直接跳到第二步:

现在总结过程:需要开通微信开发平台账号,安全认证过的https:开头的安全域名

第一步:配置如下:appsecret ,业务域名,



可理解是小程序的后台数据的服务接口,打通微信小程序和公司服务器数据库,本质是服务器跨域互相调用信息



可理解是小程序的后台数据的服务接口,打通微信小程序和公司服务器数据库,本质是服务器跨域互相调用信息



可理解是小程序的后台数据的服务接口,打通微信小程序和公司服务器数据库,本质是服务器跨域互相调用信息

注意事项:

服务器域名要是https:安全认证,同时需要TLS为2.0以上,不大理解,没关系,配置好

微信请求,根据错误一步步解决就好,百度都有,

阿里云服务器,有提供网站免费安全证书,可以申请

至于TSL2.0升级,网络上有文件

如下

第二步:进行登录获取openid,等用户信息,存放在本地缓存,和全局变量中,方便其他页面,调用

全局app.js文件如下:公司项目,需要绑定其他项目用户个人信息

App({
  //扫码进来,不知道是否启动,暂时不管
  onLaunch: function () {
    // 展示本地存储能力
    var logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs);
    //本地测试方便之用
    if ((!this.globalData.workno) || (!wx.getStorageSync("workno"))) {
      wx.login({
        success: res=>{
          if (res.code) {
            wx.request({
              url: 'https://www.xxx.cn/yxyj.ashx?Method=getopenid&appid=wx****************&secret=***&js_code=' + res.code + '&grant_type=authorization_code' + '&launch=true',
              success: result=>{
                var res = result.data[0];
                var that=this;
                res.openid != null ? (that.globalData.openid = res.openid, wx.setStorageSync('openid', res.openid)) : '';
                res.WorkNO != null ? (that.globalData.workno = res.WorkNO, wx.setStorageSync('workno', res.WorkNO)) : '';
                res.NetworkNO != null ? (that.globalData.networkno = res.NetworkNO, wx.setStorageSync('networkno', res.NetworkNO)) : '';
                res.RealName != null ? (that.globalData.realname = res.RealName, wx.setStorageSync('realname', res.RealName)) : '';
                res.RoleName != null ? (that.globalData.rolename = res.RoleName, wx.setStorageSync('rolename', res.RoleName)) : '';
                res.UserType != null ? (that.globalData.usertype = res.UserType, wx.setStorageSync('usertype', res.UserType)) : '';
                res.BankSear != null ? (that.globalData.banksear = res.BankSear, wx.setStorageSync('banksear', res.BankSear)) : '';
                that.globalData.userData = true;
                //由于这里是网络请求,可能会在 Page.onLoad 之后才返回  所以此处加入 callback 以防止这种情况
                if (this.userDataCallback) {
                  this.userDataCallback(result);
                }
              }
            })
          } else {
            conso1e.log('获取用户登录态失败!' + res.errM3g)
          }
        }
      });
    }

注意事项:

第一点:



考虑全局变量,获取登录用户,相关信息时,一定要确保是在使用之前调用, 即



考虑全局变量,获取登录用户,相关信息时,一定要确保是在使用之前调用, 即



考虑全局变量,获取登录用户,相关信息时,一定要确保是在使用之前调用, 即

同步异步问题,如上所示:如果后执行,存在回调函数,执行回调函数,

if (this.userDataCallback) {

this.userDataCallback(result);

}

第二点:

es6中有箭头函数,区别一般函数,可以确保this,总是指向定义对象的,

res=>{}

success: result => {

var res = result.data[0];

var that = this;

}



版权声明:本文为xu2034029667原创文章,遵循 CC 4.0 BY-SA 版权协议,转载请附上原文出处链接和本声明。