//app.js
App({
setConfig: { //一些配置数据
url: '', //配置请求地址的baseUrl
requestConfig:{ //自己封装了个request 处理一些共用的抛错toast ,requestConfig是app.request里的参数,配置些默认参数
data:{},
token:"", //在小程序授权后,本教程基于token处理用户登录凭证
type:"POST",
callback:function(){},
failCb:function(){}
}
},
globalData: { // 小程序推荐全局共用的数据,存在 globalData里
userInfo: null,
token:''
},
onLaunch: function () {
this.userLogin(); // 调用登录方法,处理登录
},
//登录
userLogin: function(callback){ //callback是用户授权登录后的一些回调函数
var that = this;
//获取登录code
wx.login({ // 小程序登录接口,成功后拿到code 到后台换取 openId, sessionKey, unionId
success: function (res) {
if (res.code) {
var codes = res.code;
//获取用户信息 // 因为 我们程序 要收集用户头像,昵称等,有一套用户体系
wx.getSetting({ //先调用getSetting 拿到用户已经授权的一些列表,如果已经授权 再后面代码 就无需再wx.authorize 授权
success: res => {
if (res.authSetting['scope.userInfo']) { // 用户信息已经授权过,
// 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
callback?(that.getUserInfoHandle(codes,callback)): (that.getUserInfoHandle(codes)); //getUserInfoHandle 方法是处理用户信息,提取出来
}else{
wx.authorize({ // 如果在那用户授权信息的时候 没有拿到,则调用wx.authorize 授权,拿用户userInfo
scope: 'scope.userInfo',
success: res => {
//用户已经同意小程序授权
callback?(that.getUserInfoHandle(codes,callback)): (that.getUserInfoHandle(codes)); //同上
},
fail: (e) =>{ //如果用户点击拒绝授权,则调用wx.openSetting 调起客户端小程序设置界面,返回用户设置的操作结果。在这边做了个封装
that.openSetting()
}
})
}
}
});
} else {
that.userLogin(); //登录失败的话 ,重新调用 登录方法
return false;
}
}
})
},
//getUserInfo
getUserInfoHandle: function (codes,callback){ // codes是wx.login 后拿到的code,callback是登录成功的回调函数
var that = this;
wx.getUserInfo({ // 获取用户信息
success: res => {
// 可以将 res 发送给后台解码出 unionId
that.globalData.userInfo = res.userInfo; // 存在全局 之后供各个page拿数据
// 所以此处加入 callback 以防止这种情况
if (that.userInfoReadyCallback) { // userInfoReadyCallback是个回调函数 由于wx.getUserInfo 是异步的,当各个page需要userInfo信息时,先判断全局userInfo是否有信息,没有则定义个回调app.userInfoReadyCallback 自己传个回调函数,才能拿到userInfo数据
that.userInfoReadyCallback(res)
}
//用户信息入库
var url = that.setConfig.url + '/login'; // 拿到信息后 ,调用登录接口
var data = { // 登录接口 需要的数据
code: codes,
encryptedData: res.encryptedData, // 这个参数和下面那个参数 我们没有直接将用户头像,昵称传递,防止数据篡改,采用加密的方式 ,后端再解密拿到用户信息 详情请看官方文档
iv: res.iv
}
callback?that.request({url, data},callback):that.request({url, data}); //登录请求
}
})
},
//openSetting
openSetting:function(){
var that = this;
wx.showModal({ // modal 提示用户
title: '提示',
content: '小程序需要获取用户信息权限,点击确认。前往设置或退出程序?',
showCancel:false,
success: function(res) {
wx.openSetting({ // 调起客户端小程序设置界面
success: (res) => {
var userInfoFlag = res.authSetting['scope.userInfo']; //拿到用户操作结果
if(!userInfoFlag){ // 如果用户没有点开同意用户授权 ,则再调用openSetting 弹框提示,总之 同意了 才会关闭modal 进入我们小程序
that.openSetting();
}else{
that.userLogin(); // 用户成功设置授权后,再调用登录方法 ,给到后台 拿用户信息 等操作
}
}
})
}
})
},
//数据交互
request: function (opts,loginCb){
let {url,data,token,callback,type,failCb}= {...this.setConfig.requestConfig,...opts}
var that = this;
//发起网络请求
wx.request({
url: url,
data: data,
method:type,
header: {
'content-type': 'application/x-www-form-urlencoded',
'token':token||that.globalData.token //每次请求都带token,进行用户认证
},
success:function(res){
//根据全局做处理
var status = ''+res.statusCode;
var firstStatus = status[0];
switch (firstStatus){
case '2':
case '3':
if(res.data.err_code){
wx.hideLoading();
wx.showToast({
title: res.data.err_msg,
icon:'none',
mask: true,
duration: 1500
})
if(res.data.err_code == '1'){ //没有登陆的错误码 重新登陆
that.userLogin();
}
return false;
}
if(url.indexOf('/login')>-1){ //登陆接口 返回token,存在全局globalData中
if (res.data.result){
that.globalData.token = res.data.result.token;
}
}
callback(res); // 成功后大回调函数
break;
case '4':
wx.showToast({
title:'客户端错哦~',
mask:true,
icon:'none',
duration:1500
})
break;
case '5':
wx.showToast({
title:'服务端错误哦~',
mask:true,
icon:'none',
duration:1500
})
break;
default:
break;
}
},
fail:function(e){
wx.showToast({
title:'当前网络状态不佳,请稍后再试',
mask:true,
icon:'none',
duration:1500
})
failCb&&failCb(e);
}
})
}
})
复制代码
#直接贴代码,复制可用哦。。。上干货