默认的头像昵称

前言

1. 情况

线上与测试环境查询消费者的时候发现有许多的灰色头像与昵称是微信用户的账户

image-20240202171259269

通过消费者账户创建代码知道,这个头像和昵称是来自微信的。

2. 问题确定

是以下:

https://api.weixin.qq.com/sns/userinfo?access_token

用这个接口获取用户信息,偶尔获得昵称是“微信用户”,大部分时候正常(微信浏览器里H5)。

在《3. 网页授权获取用户信息》里面也有调用到这个接口去获取用户信息,只是作用域是不一样的,在这里只是需要一个最基本的头像和昵称。

3. 原因

出现这个情况是因为微信对于网页授权能力进行了调整,新增了一个快照功能,对于不规范的访问时,提供快照页进行基础浏览。在这种情况下,我们通过网页授权接口获取到的微信用户信息均为虚拟数据(也就是微信用户昵称与灰头像)。

image-20240202172819421

正文

在微信开发文档网页授权开发文档里面可以看到 《这里》的返回值里面有is_snapshotuser

image-20240202173927993

我们可以对于这个值的传递来判断是否为快照模式,通过对其拦截返回状态给到前端,引导消费者去授权完整信息。

image-20240202174216074

最后

  1. is_snapshotuser不是必传,需要进行判空,在非快照模式下是没有这个数据返回的
  2. 未授权完整的消费者可以给其浏览,但是不进行创建消费者账户,只有授权完整才能体验完整的服务(下单等)。
    给其浏览,但是不进行创建消费者账户,只有授权完整才能体验完整的服务(下单等)。
  3. 服务里面是在微信用户在进行扫码登录网页服务的时候去创建消费者用户,然后返回token,可以提前拦截,不给创建消费者账户与返回token,那么这个网页就只能浏览公共信息,一些下单,查询等就自然不可用了(登录之后才能做的操作)。
### 微信小程序获取用户昵称头像微信小程序中,获取用户的昵称头像通常是通过调用微信提供的官方接口完成的。由于涉及隐私数据,这一过程需要获得用户的授权。 #### 使用 `wx.getUserProfile` 方法 自微信基础库版本 2.10.4 起,推荐使用 `wx.getUserProfile` 来获取用户个人信息,包括昵称头像。此方法会弹出标准的授权窗口提示用户同意授权[^3]。 以下是实现代码示例: ```javascript // app.js 或页面 js 文件中 Page({ getUserInfo() { wx.getUserProfile({ desc: '用于完善会员资料', // 声明获取用户信息的用途 success(res) { const userInfo = res.userInfo; console.log('用户昵称:', userInfo.nickName); console.log('用户头像:', userInfo.avatarUrl); // 将获取到的信息存储到本地或其他操作 wx.setStorageSync('nickName', userInfo.nickName); wx.setStorageSync('avatarUrl', userInfo.avatarUrl); }, fail(err) { console.error('获取用户信息失败:', err); } }); } }); ``` #### 手动上传方式 如果希望用户提供自己的昵称或从相册选择头像,则可以采用以下方案: - **昵称输入框**:创建一个表单供用户填写。 - **头像选择器**:利用 `wx.chooseImage` 提供给用户从相册选取图片的功能[^1]。 下面是具体实现代码: ```html <!-- wxml --> <view> <input placeholder="请输入您的昵称" bindinput="bindNickNameInput"/> <button bindtap="chooseAvatar">选择头像</button> <image src="{{avatar}}" mode="aspectFit"></image> </view> ``` ```javascript // js Page({ data: { nickName: '', avatar: '' }, bindNickNameInput(e) { this.setData({ nickName: e.detail.value }); }, chooseAvatar() { wx.chooseImage({ count: 1, sizeType: ['original', 'compressed'], sourceType: ['album', 'camera'], success(res) { const tempFilePaths = res.tempFilePaths; this.setData({ avatar: tempFilePaths[0] }); // 可选:将临时路径上传至服务器保存 wx.uploadFile({ url: '<your-server-url>', // 替换为实际服务器地址 filePath: tempFilePaths[0], name: 'file', success(uploadRes) { console.log('头像上传成功:', uploadRes); } }); }.bind(this), fail(err) { console.error('选择头像失败:', err); } }); } }); ``` 以上两种方法分别适用于不同场景下的需求。对于大多数情况而言,优先考虑使用微信内置 API 完成自动化流程;而当特殊业务逻辑不允许依赖默认权限时,可采取手动录入的方式替代[^2]。
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值