微信小程序获取用户头像和昵称(填写头像昵称能力)
开放能力调整公告
总体来说就是通过按钮来授权获取用户基础信息的能力都没啦(wx.getUserProfile,wx.getUserInfo都不行了),都要使用新版本的 【头像昵称填写能力】啦。
小程序用户头像昵称获取规则调整公告
获取头像
获取头像代码
wxxl部分
<button class="avatar-wrapper" open-type="chooseAvatar" bind:chooseavatar="onChooseAvatar"><image class="avatar" src="{{avatarUrl}}"></image> </button>
js部分
Page({data: {avatarUrl: defaultAvatarUrl,},onChooseAvatar(e) {const { avatarUrl } = e.detail //获取图片临时路径this.setData({avatarUrl,})} })
适配头像时需要注意的地方
此时获取到的头像路径为本地路径,虽然可以在页面上显示,但是并不能直接入库使用,浏览器上是访问不到的。需要上传到我们自己的服务器,后面每次使用都从我们自己的服务器上取。 其实说白了就是之前头像文件我们都是从微信服务器获取的,现在需要去我们自己的服务器获取了。wx.uploadFile({url: '我们自己的服务器地址', //仅为示例,非真实的接口地址filePath: '图片临时路径',name: 'uploadFile', //自定义namesuccess(res) {console.log('res', res); //经自己服务器存储后,将地址返回到客户端。},fail(err) {console.log('err', err);},complete(cp) {console.log(cp);}})
获取昵称
- 获取头像代码,将input中的“type”属性设置为‘nickname’,同时对"name"属性设定值,点击提交按钮后根据设置的name值获取对应的value。
<form bindsubmit="getUserName"> <!--定义提交事件--><view class="cu-form-group"><view class="title">昵称:</view><input placeholder="请输入昵称" type="nickname" name="nickname" maxlength="32"></input></view><view class="up-bt"><button form-type="submit" role="button" aria-disabled="false" class="save-bt cu-btn block bg-blue margin-tb-sm lg">更新资料</button></view></form>
- js部分
getUserName(e) {console.log(e.detail.value.nickname); //用户输入或者选择的昵称},
获取昵称需要注意的地方
- 用户输入或者选择昵称时,会异步对用户输入的内容进行安全监测,若未通过安全监测,微信将清空用户输入的内容,建议开发者通过 form 中form-type 为submit 的button 组件收集用户输入的内容。
微信小程序获取用户头像和昵称(填写头像昵称能力)相关推荐
- 微信小程序获取用户信息-头像、昵称......
微信小程序获取用户信息-头像.昵称等,并出现弹窗提示授权 目录 微信小程序获取用户信息-头像.昵称等,并出现弹窗提示授权 1.wx.getUserProfile文档 2.代码演示 3.演示过程(图示) ...
- 微信小程序获取用户信息
微信小程序获取用户信息 微信小程序获取用户信息接口做了调整: 2021年4月28日24时后发布的小程序新版本,无法通过wx.getUserInfo与获取用户个人信息(头像.昵称.性别与地区),将直接获 ...
- 微信公众号/微信小程序获取用户信息以及推送微信模版消息_MQ
微信公众号/微信小程序获取用户信息以及推送微信模版消息_MQ 一.获取用户信息 1.首先我们需要了解什么是微信用户的OpenID 在关注者与公众号产生消息交互后,公众号可获得关注者的OpenID(加密 ...
- 微信小程序获取用户信息更新解决方案
微信小程序获取用户头像和昵称更新了,以下代码是兼容旧版本微信和新版本微信的解决方案,仅供参考 直接上代码 <template><!-- 顶部用户信息显示 --><view ...
- 微信小程序获取用户信息流程(2022年版)
开门见山地说,本文主要讲述微信小程序在2022年以后获取用户信息的主要方法,如果想要了解2022年之前微信小程序获取用户信息的相关知识或者是微信小程序之前这部分的设计思想的话,推荐博主的下面这篇博客 ...
- 微信小程序获取用户信息(纯前端)
特别说明 2022年10月25日起,小程序 wx.getUserProfile 接口将被收回. 微信官方不希望开发者直接拿用户的昵称和头像,若小程序需要设置昵称和头像,可以单独开发一个设置页,由用户手 ...
- 微信小程序获取用户手机号授权方法
微信小程序获取用户手机号方法 首先在 app.json 页面添加一个新的用户授权页面,放在首页index的后面即可 在 app.js 页面中编写如下代码: 这里包含了获取用户信息的相关代码 //app ...
- 微信小程序获取用户信息,得到是匿名信息,微信用户,问题解决
文章目录 微信小程序获取用户信息,得到是匿名信息,微信用户,问题解决 1.官方声明 2.究其原因 3.登陆流程变更 4.实际情况 5.PC 端兼容注意点 微信小程序获取用户信息,得到是匿名信息,微信用 ...
- 微信小程序获取用户手机号--官方示例
微信小程序获取用户手机号–官方示例 https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/getPhoneNu ...
- 微信小程序 获取用户信息并保存登录状态
微信小程序 获取用户信息并保存登录状态:http://www.360doc.com/content/18/0124/11/9200790_724662071.shtml 转载于:https://www ...
最新文章
- 电脑开机显示Invalidsystemdisk
- tf.keras.losses.KLDivergence KL散度 损失函数 示例
- pytorch 索引
- 基本的JVM内存分配过程案例
- 戴尔便携式计算机无法开机,戴尔笔记本电脑开不了机如何解决【解决方法】
- 嵌入式Linux安装Python环境,linux环境下安装python 3
- java控制台打印图片_java——控制台输入打印图形
- 什么是空间分配担保策略?
- 杭电2100Lovekey
- bzoj 2244: [SDOI2011]拦截导弹
- Matter-JS constraint 约束
- 9.2 配置rsync+inotify实时同步
- 综合布线屏蔽系统的现状与应用
- 读取日志时发生乱码的解决方法
- 苹果平板怎么卸载软件_石全石美软件更新,苹果安卓平板都能使用
- #51CTO学院四周年# 我和51cto的故事
- 在Windows 7 Media Center中创建幻灯片放映
- 【数据字典】第三篇 利用PowDesigner自动生成数据字典
- 数据分析师的就业前景如何?
- Java EE 及Jess安装
热门文章
- 信捷pLC C语言错误格式,信捷PLC常见问题及解决方法经验分享
- HTML基础介绍和基础骨架
- 利用FRP跨局域网操纵虚拟机集群
- 指纹测试天赋测试软件,指纹也能测天赋 10分钟出结果(图)
- Maven的安装、配置及使用入门
- 微信突发闪退 BUG,罪魁祸首竟是一张神奇的二维码图片
- 在anti-spoofing中,在OULU数据集上求APCER,BPCER,ACER上的一个注意事项
- ARToolKit在visual studio2013(win10)的环境配置
- 学猫叫用计算机歌词,抖音学猫叫是什么歌 学猫叫歌曲歌词
- 网易2019年春招笔试:爬塔玩法