微信小程序三种授权登录的方式

谁借莪１个温暖的怀抱￠ 2022-10-23 08:26 146阅读 0赞

经过一段时间对微信小程序的研发后 总结出以下三种授权登录的方式，我给他们命名为‘一次性授权’‘永久授权’‘不授权’ [演示站][Link 1]

1.一次性授权  
常规写法，需要获取用户公开信息（头像，昵称等）时，判断调取授权登录接口，但是此方法如果不经处理的话 用户如果拒绝授权或者删除该微信小程序后 需要重新调取并获取用户公开信息（头像，昵称等），此方法用户体验较差，不建议使用；

2.永久授权  
在不必要使用用户公开信息（头像，昵称等）时，不调取授权登录接口，只有在必要的时候再去判断调取授权登录接口并把获取到的用户公开信息存入数据库，这样在每次登录时直接先运行指定函数从数据库索取需要的用户公开信息（头像，昵称等）即可，此方法在删除小程序后不用再次去授权登录（因为在用户第一次授权登录时已经把用户的公开信息存入数据库了以后直接向数据库索取即可），建议使用；

3.不授权  
不需要授权登录获取用户公开信息（头像，昵称等），使用wx.login获取用户code并传入后台，后台可以通过用户的code值向微信要一个值（具体需要问后台，我只是个小前端，后台的东西不是很懂，只是知道一些逻辑而且也已经成功实现）然后通过这个用code换取的值就可以识别到指定用户，如果需要的话，前端要显示的头像、昵称等这些信息可以使用自定义可编辑的功能，当然，也可以通过<open-data type=“userAvatarUrl”></open-data><open-data type=“userNickName”></open-data>小程序提供的这个组件显示用户的头像及昵称（不过这个组件只有显示功能），用户如果想直接使用自己的头像昵称，也可以自行授权（比如添加个引导按钮什么之类的），建议使用；

![微信小程序三种授权登录的方式][0d5400a5f56e741873a43fa7e3fc80f5.png]

文中使用的微信自带接口、组件及函数：

<open-data type=“userAvatarUrl”></open-data>
    <open-data type=“userNickName”></open-data>
    
    wx.login({
       success(res){
         console.log(res.code)
      }
    })

微信授权登录

以上三种方式可以灵活运用，也可以把需要的结合到一起，并不冲突

[Link 1]: https://github.crmeb.net/u/LXT
[0d5400a5f56e741873a43fa7e3fc80f5.png]: /images/20221023/5c6c75485fcb4ac6b3bfd5c92769e16b.png