小程序用户头像昵称获取规则调整与之对应调式策略、新API接口的bug

news2024/12/23 17:40:40

目录

调整时间

调整背景

调整说明

 开发者与之对应的debug策略

1.button里面包含一个image,这种包含关系

2.然后我们可以看到官方给出的是用button组件中的open-type属性并且给到了一个chooseAvatar值!

3.我们会发现光放给我们了一个“配置好的”命令码:bind:chooseavatar="onChooseAvatar"

4.我们用这个接口的时候我们可以对应的打印出相对应的东西

5.官方提供的可使用的数据

6.官方给我们开发者的只是一个简单的input中的获取昵称的空框架:

7.JavaScript中昵称数据的交互:我们就将他打印出来:

新API接口的bug问题

警告!!!!!!!!!!!!


调整时间

更新时间:2022年11月9日

调整背景

在小程序内,开发者可以通过 wx.login 接口直接获取用户的 openId 与 unionId 信息,实现微信身份登录,支持开发者在多个小程序或其它应用间匿名关联同一用户。

同时,为了满足部分小程序业务中需要创建用户的昵称与头像的诉求,平台提供了 wx.getUserProfile 接口,支持在用户授权的前提下,快速使用自己的微信昵称头像。

但实践中发现有部分小程序,在用户刚打开小程序时就要求收集用户的微信昵称头像,或者在支付前等不合理路径上要求授权。如果用户拒绝授权,则无法使用小程序或相关功能。在已经获取用户的 openId 与 unionId 信息情况下,用户的微信昵称与头像并不是用户使用小程序的必要条件。为减少此类不合理的强迫授权情况,作出如下调整。

调整说明

自 2022 年 10 月 25 日 24 时后(以下统称 “生效期” ),用户头像昵称获取规则将进行如下调整:

  1. 自生效期起,小程序 wx.getUserProfile 接口将被收回:生效期后发布的小程序新版本,通过 wx.getUserProfile 接口获取用户头像将统一返回默认灰色头像,昵称将统一返回 “微信用户”。生效期前发布的小程序版本不受影响,但如果要进行版本更新则需要进行适配。
  2. 自生效期起,插件通过 wx.getUserInfo 接口获取用户昵称头像将被收回:生效期后发布的插件新版本,通过 wx.getUserInfo 接口获取用户头像将统一返回默认灰色头像,昵称将统一返回 “微信用户”。生效期前发布的插件版本不受影响,但如果要进行版本更新则需要进行适配。通过 wx.login 与 wx.getUserInfo 接口获取 openId、unionId 能力不受影响。
  3. 「头像昵称填写能力」支持获取用户头像昵称:如业务需获取用户头像昵称,可以使用「头像昵称填写能力」(基础库 2.21.2 版本开始支持,覆盖iOS与安卓微信 8.0.16 以上版本),具体实践可见下方《最佳实践》。
  4. 小程序 wx.getUserProfile 与插件 wx.getUserInfo 接口兼容基础库 2.27.1 以下版本的头像昵称获取需求:对于来自低版本的基础库与微信客户端的访问,小程序通过 wx.getUserProfile 接口将正常返回用户头像昵称,插件通过 wx.getUserInfo 接口将正常返回用户头像昵称,开发者可继续使用以上能力做向下兼容。

 开发者与之对应的debug策略

根据wx团队提供的另一个API:

「头像昵称填写能力」支持获取用户头像昵称

首先我们根据官方文档里提供的有限的信息,先写上基本的框架:

<button class="button" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar">
  <image class="avatar" src="{{avatarUrl}}"></image>
</button> 
<input type="nickname" bindinput="input" class="weui-input" placeholder="请输入昵称"/>
<button type="primary" class="shangchuan">上传到数据库</button>
const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'
Page({
  data: {
    avatarUrl: defaultAvatarUrl,
  },
  onChooseAvatar(e) {
    console.log(e)
    const { avatarUrl } = e.detail 
    this.setData({
      avatarUrl,
    })
  },

})

解释一下官方给出的框架信息:

1.button里面包含一个image,这种包含关系

说明白点他就是想让开发者编写一些时间来实现让用户有意识的点击image里面的图片来,“情愿”的授权自己的头像。当然也可以授权上传用户的其他图片作为头像!

2.然后我们可以看到官方给出的是用button组件中的open-type属性并且给到了一个chooseAvatar值!

大家如果熟读官方开发文档就会发现每一个属性都会附带几个参数值。比如这里用到的open-type属性里面的chooseAvatar值获取用户头像,可以从 bindchooseavatar 回调中获取到头像信息,返回为string类型数据,并支持最低版本的2.21.2版本

3.我们会发现光放给我们了一个“配置好的”命令码:bind:chooseavatar="onChooseAvatar"

这一坨代码的意思:我们通过bind事件(冒泡)来获取到我们上面已经写好的:open-type="chooseAvatar",所以就有了这种形式的代码:bind:chooseavatar。然后他是一个bind冒泡所以我们要给他自定义一个事件来,通过JavaScript交互处理来实现相对应的事件逻辑!

4.我们用这个接口的时候我们可以对应的打印出相对应的东西

  onChooseAvatar(e) {
    console.log(e)
    const { avatarUrl } = e.detail 
    this.setData({
      avatarUrl,
    })
  },

 

因为这个API接口与其他的API接口不同,他必须通过真机调试才可以与JavaScript中的数据返回参数做一个交互!

真机debug中获取到的返回数据:

 

 我们可以清楚的看到,里面返回出来的数据中的detail中就有我们想要的数据,所以官方给我直接提供了“套餐服务”:

const { avatarUrl } = e.detail 
    this.setData({
      avatarUrl,
    })

我们获取到之后直接可以返回到前台(客户端)页面

注意:此操作过程只能用真机调试可见!!!

5.官方提供的可使用的数据

const defaultAvatarUrl = 'https://mmbiz.qpic.cn/mmbiz/icTdbqWNOwNRna42FI242Lcia07jQodd2FJGIYQfG0LAJGFxM4FbnQP6yfMxBgJ0F3YRqJCJ1aPAK2dQagdusBZg/0'

这一坨代码很好理解,这就是官方为我们开发者提供了一个默认的用户头像。

然后:data{}里面的avatarUrl: defaultAvatarUrl,就是把官方提供的默认用户头像defaultAvatarUrl复制到一个自定义的avatarUrl中。

所以,我们在前台就可以写一条渲染语句将其对应的渲染到页面中:

src="{{avatarUrl}}"

6.官方给我们开发者的只是一个简单的input中的获取昵称的空框架:

<input type="nickname" class="weui-input" placeholder="请输入昵称"/>

我们获取授权昵称时,我们可以做一个稍微的改动:

添加一个:

bindinput="input" 

完整:

<input type="nickname" bindinput="input"  class="weui-input" placeholder="请输入昵称"/>

之所以我们要添加bindinput属性,是因为我们要拿到我们授权的昵称,只有拿到我们想要的数据,才能实现后续的对数据库的曾删改查!!!

7.JavaScript中昵称数据的交互:我们就将他打印出来:

  input(e){
    console.log(e)
  }

然后我们开始尝试通过真机debug来获取我们用户的昵称数据:

 

 我们可以清楚的看到微信昵称已经拿到!!!

然后,开发者们就可以根据自己项目的不同从而,对数据做不同的处理!!!

新API接口的bug问题

警告!!!!!!!!!!!!

对于官方新推出的wx.cropImage(Object object)这个接口,我的建议是先不要尝试!!

目前,此接口存在严重bug

当我们对静态资源调用该接口时,会出现无法识别setData等奇怪bug

目前官方团队正在努力修复此bug!!!

bug如下:

 官方给出的bug确认:

 

本文来自互联网用户投稿,该文观点仅代表作者本人,不代表本站立场。本站仅提供信息存储空间服务,不拥有所有权,不承担相关法律责任。如若转载,请注明出处:http://www.coloradmin.cn/o/135401.html

如若内容造成侵权/违法违规/事实不符,请联系多彩编程网进行投诉反馈,一经查实,立即删除!

相关文章

CSAPP Cache Lab

CSAPP Cache Lab 本实验将帮助您了解缓存存储器对 C 语言性能的影响程式。实验室由两部分组成。 在第一部分中&#xff0c;您将编写一个小的 C 程序&#xff08;大约 200-300 行&#xff09;模拟高速缓存的行为。 在第二部分中&#xff0c;您将优化一个小型矩阵转置函数&#…

NoMachine出现 The session negotiation failed的解决方案及踩坑总结

问题情况&#xff1a;我A电脑输入用户名和密码可以远程B电脑&#xff0c;B电脑输入用户名密码就是登录不上A电脑。 B电脑上密码是用的账户密码&#xff08;就是图标是一把钥匙的那个&#xff09;。 A电脑上的密码是用的PIN密码&#xff08;Win11系统推荐的那个&#xff09;。 通…

ArcGIS基础实验操作100例--实验37线要素生成规则或随机采样点

本实验专栏参考自汤国安教授《地理信息系统基础实验操作100例》一书 实验平台&#xff1a;ArcGIS 10.6 实验数据&#xff1a;请访问实验1&#xff08;传送门&#xff09; 高级编辑篇--实验37 线要素生成规则或随机采样点 目录 一、实验背景 二、实验数据 三、实验步骤 &…

小程序安全设置的经验分享

一、小程序框架概述 在第一部分小程序框架概述中,将介绍小程序抽象框架、小程序调用框架和小程序初始化流程。下面让大白来逐一介绍。 1、小程序抽象框架 1.1视图层 包含WXML、WXSS和页面视图组件。 WXML是一种类似XML格式的语言,支持数据绑定、条件渲染、列表渲染、自定…

零入门容器云网络-10:基于golang编程netlink包方式操作tun设备

已发表的技术专栏&#xff08;订阅即可观看所有专栏&#xff09; 0  grpc-go、protobuf、multus-cni 技术专栏 总入口 1  grpc-go 源码剖析与实战  文章目录 2  Protobuf介绍与实战 图文专栏  文章目录 3  multus-cni   文章目录(k8s多网络实现方案) 4  gr…

【Linux】静态库和共享库

目录 库是什么 静态库和共享库 库的链接 优缺点 查看使用的库 制作库 制作静态库 静态库的使用 制作共享库 共享库的使用 静态库和共享库的区别 库是什么 库就是预先编译好的方法的集合 .h中是库函数的声明&#xff0c;库函数的实现在库中&#xff0c;如&#xff…

ChatGPT上线了!我在2023年1月2日这一天用上了它!百问百答!我只能说(真NB)算法工程师可以不用百度/Google了!

目录:问答结果1、你有什么nlp算法&#xff1f;2、平台终端3、如何训练深度学习模型&#xff1f;4、如何压缩nlp模型&#xff1f;5、bert模型有哪些用途&#xff1f;6、你知道汽车座舱吗&#xff1f;7、知识图谱有什么用途&#xff1f;8、能给一个构建知识图谱的案例吗&#xff…

S32K144—基于MBD的BLDC六步换相算法

可以简单分为六个功能区域&#xff1a; 1、全局变量 全局变量的定义是建模过程中遇到的第一个难点&#xff0c;因为它涉及到我们软件开发中最基础的东西——数据类型定义&#xff08;Data Types Definition&#xff09;。 在 Simulink 中可以通过 Bus Editor 构建自定义数据类…

【 shell 编程 】第5篇 文本编辑三剑客

文本编辑三剑客 文章目录文本编辑三剑客一、正则表达式1.基本正则表达式元字符2.拓展正则表达式元字符二、grep1.grep2.egrep3.fgrep三、sed四、awk一、正则表达式 1、简介&#xff1a;正则表达式是对字符串&#xff08;包括普通字符&#xff08;例如&#xff0c;a 到 z 之间的…

点云算法-提取kitti路面点云

目录 一、ransac原理 二、ransac 地面分割原理 三、ransac常见应用 四、代码 五、截图 六、总结 一、ransac原理 RANSAC是“random sample consensus&#xff08;随机抽样一致&#xff09;”的缩写。它可以从一组包含“局外点”的观测数据集中&#xff0c;通过迭代方式估…

【408篇】C语言笔记-第二十一章(汇编语言)

文章目录第一节&#xff1a;汇编指令格式讲解1. 汇编指令格式2. 生成汇编方法第二节&#xff1a;汇编常用指令讲解1. 相关寄存器2. 常用指令3. 条件码第三节&#xff1a;各种变量赋值汇编实战1. 各种变量赋值汇编实战解析第四节&#xff1a;选择循环汇编实战1. 选择循环汇编实战…

基于ssm+mysql+jsp实现歇后语管理系统

基于ssmmysqljsp实现歇后语管理系统一、系统介绍二、系统展示1.歇后语大全2.歇后语排行榜3.歇后语管理4.用户管理三、其它系统四、获取源码一、系统介绍 本系统实现了 普通用户&#xff1a;歇后语大全、歇后语排行榜、歇后语管理 管理员用户&#xff1a;歇后语大全、歇后语排行…

一键替换Markdown文件的字体样式

功能说明 一键替换MD文件的字体样式&#xff1a;加粗字体—>橙色不加粗 也可以针对其它样式做切换&#xff0c;源码就一个demo类&#xff0c;修改正则匹配相关变量即可&#xff1b; 环境要求&#xff1a; windows jdk1.8 工具下载 百度网盘&#xff1a;提取码: ae16 …

week9

T1【深基18.例3】查找文献 题目描述 小K 喜欢翻看洛谷博客获取知识。每篇文章可能会有若干个&#xff08;也有可能没有&#xff09;参考文献的链接指向别的博客文章。小K 求知欲旺盛&#xff0c;如果他看了某篇文章&#xff0c;那么他一定会去看这篇文章的参考文献&#xff0…

7.1 定义抽象数据类型

文章目录定义改进的Sales_data 类定义成员函数引入this指针引入const成员函数类作用域和成员函数在类的外部定义成员函数定义返回this的函数类的静态成员定义类相关的非成员函数构造函数合成的默认构造函数某些类不能依赖合成的默认构造函数定义构造函数拷贝 赋值和析构某些类不…

11.2、基于Django4的可重用、用户注册和登录系统搭建(优化)

文章目录前端界面设计与优化完善登录界面的视图函数session会话和登出的视图函数将当前代码推送至Gitee添加图片验证码前端界面设计与优化 使用CSS框架 Bootstrap4&#xff0c;Bootstrap将CSS样式和JS都封装好了&#xff0c;可以直接使用。 下面使用的Bootstrap模板来自官方文…

AHB协议(1/2)

AHB协议&#xff08;1/2&#xff09; 以下内容为AMBA5 AHB Protocol Specification协议内容 Charpter 1 Introduction 1.1 关于AHB协议 AMBA AHB是一个支持高性能设计的总线接口。他在组件间&#xff0c;如主端&#xff08;Master&#xff09;&#xff0c;互联结构&#xf…

云原生之使用Docker部署Dailynotes个人笔记管理工具

云原生之使用Docker部署Dailynotes个人笔记管理工具一、Dailynotes介绍二、检查本地docker环境1.检查docker版本2.检查docker状态三、下载Dailynotes镜像四、创建Dailynotes容器1.创建数据目录2.创建Dailynotes容器3.查看Dailynotes容器状态五、访问Dailynotes1.进入Dailynotes…

uniCloud云开发----5、uni-id-pages的使用

uni-id-pages的使用前言1、下载uni-id-pages插件2、查看登录页面3、配置项云端配置config.json前言 在开发过程中&#xff0c;会发现微信小程序的登录方式不断地更新和变化&#xff0c;这样导致我们在开发过程中非常的困难&#xff0c;uni-id-pages直接集成的页面和数据库来实…

67、【链表】leetcode——242. 有效的字母异位词(C++版本)

题目描述 原题链接&#xff1a;242. 有效的字母异位词 一、ASCII码作为Key 因s和t都为小写字母&#xff0c;因此可将s和t中字母用ASCII码数字表示&#xff0c;减去a&#xff0c;映射到0-25当中&#xff0c;作为Hash表映射结构。 首先&#xff0c;查看s和t的长度是否相同&…