微信小程序wx.login()登陆流程

微信小程序的登陆一般都是型闷写在app.js当中，具体流程如下

1、用户通过login（）方法获取code，然后把code传给开发后台，后台通过code 以及appid以及密钥获取openid和sessionkey 进行登陆，然后返回一个token给前端

2、前端拿到token之后存储到globalData里的变量当中，这样其他页面就是可以同过var app=getapp（）；app.globalData调用token，但是全局变量会随之小程带悉序关闭，就会清除变量，所以我们要将token存到缓卜行弯存当中，

        ① 在onLaunch中token的具体流程是

公司业务开展，最近完成了一个微信小程序的开发。场景是这样，同一微信开放平台下拥有相同主体的APP和微信小程序来完成同样的业务，用户进入app或者微信小程序时必须获纯核取用做者掘户的unionid来确认当前的用户身份，完成登录。小程序“获取用户信息”api（getUserInfo）的调用方式和之前相比有了较大更新，优雅的实现用户授权和登录非常重要，以下是我在微信小程序授权登录相关流程在开发时候的实现思路和总结，分享如下。

说明：

你可以简单的理解为

如果开发者在多个移动应用、网站应用和公众帐号之间有统一用户账号的需求，需要前往微信开放平台（open.weixin.qq.com）绑定公众号后，便可利用UnionID机制来满足上述需求。

用户在开放平台的唯一标识符

你可以简单的理解为:

微信针对不同的用户在不同的应用下都有唯一的一个openId, 但是要想确定用户是不是同一个用户，就需要靠unionid来区分。一般自己的后台都会有自己的一嫌槐个用户表，每个用户有不同的userid。也就是说同一个用户在同一个微信开放平台下的相同主体的应用对应着相同的userid,unionid以及不同的openid。所以在用户登录进来的时候，我们只能靠微信返回给我们的unionid去判断是不是同一个用户，在去关联我们的用户表，拿到对应的userid。

绑定了开发者帐号的小程序，可以通过下面3种途径获取UnionID。

当用户满足条件2和3时，开发者可以直接通过wx.login获取到该用户的unionid, 否则必须调用接口 wx.getUserInfo ,额外需要注意的事就是妥善处理用户拒绝授权的情况。

在真实的业务场景中，我们希望，用户进入小程序时，未登录情况下可以正常浏览商品，对小程序有个基本的认知，不要直接d出框要求用户授权，否则会干扰用户，导致新用户的流失，当用户需要使用一些高级功能和场景，这个时候再去要求用户授权，这样用户授权的几率会大大提高。

将登录的逻辑封装ajax

流程：

封装的意义

不再关注当前接口是否需要登录，用户是否已授权，所有请求直接调用 ajax() ,在必要的时候完成一切登录以及授权流程。小程序入口页面增加，业务拓展的时候，你只需要专注于业务实现。

参考资料

小程序所有新进用户的昵称全部变成了“微信昵称”，当时我就

吓得我赶紧爬起来翻文档(需要代码直接往后翻)

原因就像微信所说的，很多开发者在打开小程序时就通过组件方式唤起getUserInfod窗，如果用户点击拒绝，无法使用小程序，这种做法打断了用户正常使用小程序的流程，同时也不利于小程序获取新用户。

这里我会给出Uni-app的适配代码，针对CRMEB系统进行修复，各位同学举一反三(4.13号之前发布的正式包暂不影响)

1.修改pages/users/wechat_login/index.vue中关于微信登录的按钮

<button span=""

class="bg-green btn1">微信登录

<button span=""

class="bg-green btn1">微信登录

2.默认仔局data中添加canUseGetUserProfile: false，然后在加载页面调用的方法里面增加uni.getUserProfile的判断，是老郑否显示新的按钮。

canUseGetUserProfile: false

if (uni.getUserProfile) {

this.canUseGetUserProfile = true

}

3.方法中新增getUserProfile方法用户获取用户信息

//小程序授权api替换 getUserInfo

getUserProfile() {

uni.showLoading({

title: '正在登录中'

})

let self = this

Routine.getUserProfile()

.then(res =>{

let userInfo = res.userInfo

userInfo.code = this.code

userInfo.spread_spid = app.globalData.spid//获取推广人ID

userInfo.spread_code = app.globalData.code//获取推广人分享二维码ID

Routine.authUserInfo(userInfo)

.then(res =>{

if (res.data.key !== undefined &&res.data.key) {

uni.hideLoading()

self.authKey = res.data.key

self.isPhoneBox = true

} else {

uni.hideLoading()

let time = res.data.expires_time - self.$Cache.time()

self.$store.commit('LOGIN', {

token: res.data.token,

time: time

})

this.getUserInfo()

}

})

.catch(res =>{

uni.hideLoading()

uni.showToast({

title: res.msg,

icon: 'none',

duration: 2000

})

})

})

.catch(res =>{

uni.hideLoading()

})

},

4.然后在libs/routine.js中增加getUserProfile方法

/**

* 新版小程序获取用户信息 2021 4.13微信小程序侍戚颂开始正式启用

*/

getUserProfile(code) {

return new Promise((resolve, reject) =>{

uni.getUserProfile({

lang: 'zh_CN',

success(user) {

if (code) user.code = code

resolve({

userInfo: user,

islogin: false

})

},

fail(res) {

reject(res)

}

})

})

}

这里要注意

if (!isset($userInfoCong['openid'])) {

throw new ValidateException('openid获取失败')

}

if (!isset($userInfoCong['openid'])) {

throw new ValidateException('openid获取失败')

}

userInfo['unionId'] = isset( userInfo [′ unionId ′]= isset (userInfoCong['unionid']) ? $userInfoCong['unionid'] : ''

userInfo['openId'] = userInfo [′ openId ′]=openid = $userInfoCong['openid']

修复完成之后重新编译小程序就可以解决授权之后微信用户的问题啦。

---