微信小程序处理用户拒绝授权以及微信登录、登录、保存等一系列解决方案

在微信小程序的开发中，当我们调用API wx.getUserInfo(OBJECT)时，需要用户授权。但是如果用户拒绝授权，如何才能兼容用户拒绝授权的状态，拥有更好的用户体验呢？

先看看这个界面的官方文档：

wx.getUserInfo(OBJECT)

要获取用户信息，需要先调用wx.login接口。

对象参数描述：

参数类型必需描述带CredentialsBoolean否是否带来登录状态信息success函数无接口调用成功回调函数fail函数无接口调用失败回调函数complete函数无接口调用结束回调函数(将执行成功和失败的调用)tip:wx.getUserInfo接口需要用户授权，请与用户拒绝授权的场景兼容。我们只是想在用户点击“拒绝”时弹出提示框，提示用户改善用户体验。就像下面这个。

具体代码是在wx.getUserInfo的fail回调函数中编写弹出窗口，如下所示：

wx . getuser info({ success 3360 function(resumer){ console . log(success)}，fail : function(){//调用微信弹出界面wx . show modal({ title : ' warning '，content: '您点击拒绝授权，它将无法正常工作*)。请在10分钟后再次单击“授权”，或者删除小程序并重新输入。success : function(RES){ if(RES . confirm){ console . log('用户点击OK') }}}}}))这样，用户就获得了提示信息，但此时，用户仍然停留在页面上。如果某些显示信息仍然是针对用户的，并且在执行某些操作时应该只验证授权，那么

第一种思维方式：

在这里保存登录状态，将用户的登录信息传递给后台，在后台保存用户的信息，在后台将open_id交换为一个SessionId。交换的SessionId作为登录状态验证进行缓存。

wx . GetUserInfo({ success : function(resumer){ let UserInfo=resumer . UserInfo that . HeaLTH API . log in(代码，UserInfo)。然后(logindata={//这里把微信的请求封装成Promiese风格的if (logindata。代码==0){ varsessionid=logindata.data//调用微信. setStorage会将交换的SessionId保存在本地缓存that .微信. setstorage ('sessionid '，session id)中。然后(()={ that . GlobalDATA . UserInfo=UserInfo类型的CB==' function ' CB(that . GlobalDATA . UserInfo)})})})，fail: functio

n () { wx.showModal({ title: '警告', content: '您点击了拒绝授权，将无法正常使用*****的功能体验。请10分钟后再次点击授权，或者删除小程序重新进入。', success: function (res) { if (res.confirm) { console.log('用户点击确定') } } }) } })

这样我们将登录态保存在了 SessionId 中，在每次登录的时候我们只需要再调用一个 检查 SessionId的接口就行，检查不通过再调微信登录接口。此处不做延伸了。

第二种思路：

在3.29微信小程序更新的版本中，加入了这样一条属性

withCredentials 字段基础库版本 1.1.0 开始支持，低版本需做兼容处理

这个字段的意思就是调用wx.getUserInfo(OBJECT) 是否带上登录态的信息。

官方文档是这样解释的：

withCredentials 字段基础库版本 1.1.0 开始支持，低版本需做兼容处理

注：当 withCredentials 为 true 时，要求此前有调用过 wx.login 且登录态尚未过期，此时返回的数据会包含 encryptedData, iv 等敏感信息；当 withCredentials 为 false 时，不要求有登录态，返回的数据不包含 encryptedData, iv 等敏感信息。

success返回参数说明：

参数类型说明userInfoOBJECT用户信息对象，不包含 openid 等敏感信息rawDataString不包括敏感信息的原始数据字符串，用于计算签名。signatureString使用 sha1( rawData + sessionkey ) 得到字符串，用于校验用户信息。encryptedDataString包括敏感数据在内的完整用户信息的加密数据，详细见加密数据解密算法ivString加密算法的初始向量，详细见加密数据解密算法

注：需要兼容微信低版本，向后兼容。

那么利用这个接口，我们可以直接拿到 登录状态，在其他需要验证登录的地方进行提示，而在不需要授权的地方还可以让用户浏览小程序。

回到前面的问题，在用户点击拒绝授权后，在某些操作时需要验证用户是否授权过，弹出交互信息，那么就利用上面的 SessionId或者withCredentials登录态进行下面的操作：

applyIn: function applyIn() {    if (wx.getStorageSync('sessionId')) {  // 根据储存的sessionId 进行验证      wx.navigateTo({        url: 'familyDoctorApply/familyDoctorApply?Oid=' + this.data.params.Oid + '&title=' + this.data.params.title + '&serviceCity=' + this.data.array[this.data.index].name + '&productPrice=' + this.data.product.productPrice      });    } else {      wx.showModal({        title: '警告',        content: '您点击了拒绝授权，无法使用此功能。',        success: function (res) {          if (res.confirm) {            console.log('用户点击确定')          }        }      })    }

效果像这样：

这样一个简单完整的登录及授权，登录态保存等前端微信小程序解决方案就完成了，还可以继续扩展到登录有效期，退出登录，用户权限等跟多扩展的地方。