uniapp小程序用户微信授权、注册流程梳理,微信小程序用户授权注册流程getUserInfo和userProfile授权注册问题详解以及open-data用户头像border-radius无效...

需求:

之前的小程序获取用户授权通常使用getUserInfo,在4月份更新中已经弃用了该方法,并通过getUserProfile代替getUserInfo进行用户授权,以获取用户的微信昵称和微信头像,项目以前采用的用户校验规则是,先判断本地有没有userInfo(用户的微信授权信息)如果没有微信信息,则弹出getUserInfo的授权弹层让用户先授权,授权以后再调用后台接口判断在后台数据库中是否存在用户信息(customerInfo),如果不存在customerInfo,即为未注册用户跳转至注册页面引导注册,如果存在customerInfo即为已注册用户,可以执行点击授权按钮是应该触发的操作,这个逻辑中涉及到微信信息的地方太多,过于累赘,所以现对已有项目进行改版,因为项目中并没有太多地方需要用到用户的微信信息,只有我的账户页面需要展示用户头像以及用户名(现在可以通过open-data标签直接获取展示,无需用户手动授权,但缺点是该方法获取到的用户头像和昵称无法进行传输交互,无法通过接口传给后台,无法保存在数据库中),那么问题来了,项目需要在后台数据中拿到用户昵称进行后台数据展示以及筛选进行会员信息管理,又不想多次重复的让用户手动授权微信信息

思路:

因为我的账户页面可以通过open-data标签展示用户信息代码如下所以只需要在用户注册的时候把用户微信信息传给后台即可,后续判断用户的过程只需要通过后台接口判断用户信息,无需判断用户是否授权微信信息(部分用户表示该方法获取到的用户头像是正方形无法修改为正圆,解决方法有两种,如下)

<open-data class="avatarUrl" type="userAvatarUrl"></open-data>
<open-data class="nickName" type="userNickName"></open-data>

// open-data标签用户头像方形问题解决方法一
.avatarUrl {
  width: 140rpx;
  height: 140rpx;
  display: block;
  margin: auto;
  border-radius: 50%;
  overflow: hidden;
}
// open-data标签用户头像方形问题解决方法二
.avatarUrl::after{
    border-radius: 50%;
}

小程序冷启动时
1.uni.getAccountInfoSync获取小程序appid
2.通过appid调用api.merchantInfo获取商户信息
3.通过uni.login()获取jscode
4.通过jscode和appid,appsecret调用后端接口获取用户openid
5.通过openid和商户信息调用api.checkUser检查用户身份信息(计划加入unionid回传,补全老数据中缺失的unionid)
5.1如果判断没有用户信息即为未注册用户
5.2如果判断存在用户信息 调用api.checkCart检查用户购物车状态并通过api.getMemberDetails获取完整的用户信息
5.2.1如果用户存在cart通过调用api.getCartList获取用户购物袋信息,(展示在tabbar购物袋的角标上)

  • 0
    点赞
  • 0
    收藏
    觉得还不错? 一键收藏
  • 0
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值