uniapp 微信小程序一键登录

2,576 阅读1分钟

在使用微信小程序时,可以通过微信授权直接登录,非常方便。

App 端需要先开通uni一键登录服务,pc 端一般使用微信扫码,API封装在了uni-id

uniapp 中一键登录的授权弹出界面是默认是半屏的,可以根据需要,在 univerifyStyle 属性中将配置成全屏,具体参数配置参考 univerifyStyle 数据结构

image.png

操作步骤

再点击登录时,调用 uni.login() 返回用户登录凭证(code),获取成功后通过 uni.getUserInfo() 获取用户信息(头像、昵称等),并将信息存储到 vuex 或本地缓存中

  • 存储:uni.setStorageSync('user', res)
  • 获取:uni.getStorageSync('user')

uni.login 各个平台支持情况: image.png

代码实现

将上述步骤进行封装,点击登录时,直接调用 login() 方法

image.png