背景:接到领导要求开发一个微信小程序,客户需要,经过一个礼拜左右的时间,基本算是可用状态
重难点:没有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;
}