微信获取unionId java 微信获取头像昵称管理

转载

岁月静好呀 2023-10-20 13:24:07

文章标签 微信获取unionId java 微信小程序获取用户信息 open-data 微信小程序获取用户头像、昵称 文章分类 Java 后端开发

博客概要

针对使用微信小程序时获取用户头像、昵称的三种方法，做一个简单分享~

文章目录

博客概要
1.wx.getUserInfo接口
2.button触发
3.open-data标签
总结

1.wx.getUserInfo接口

传统效果是会出现“授权弹窗”，需要用户手动确认。目前，此接口已有调整，使用该接口将不再出现授权弹窗，请使用方法2（如下）引导用户主动进行授权操作

示例场景：

用户未授权，调用该接口将直接报错
用户已授权，可使用该接口正常获取用户信息

2.button触发

不出现“授权弹窗”，但需要button做引导，来得会没有弹窗突兀…

示例代码：

<!--wxml-->
	<block wx:if="{{hasUserInfo === true}}">
		<image src="{{userInfo.avatarUrl}}"></image>
		<text>{{userInfo.nickName}}</text>
	</block>
	<button 
		open-type="getUserInfo" 
		bindgetuserinfo="getUserInfo"
	>
		授权登录
	</button>

//js
Page({
  data: {
    hasUserInfo: false
  },
  getUserInfo(info) {
    const userInfo = info.detail.userInfo
    this.setData({
      userInfo,
      hasUserInfo: true
    })
  },
})

运行结果：

微信获取unionId java 微信获取头像昵称管理_获取用户信息

微信获取unionId java 微信获取头像昵称管理_微信小程序获取用户头像、昵称_02

样式自行填充= =

元素说明：

属性	说明
open-type	微信开放能力
bindgetuserinfo	用户点击该按钮时，会返回获取到的用户信息回调的detail数据与wx.getUserInfo返回的一致 open-type="getUserInfo"时有效
…	…

open-type合法值

值	说明
getUserInfo	获取用户信息可以从bindgetuserinfo回调中获取到用户信息
contact	打开客服会话如果用户在会话中点击消息卡片后返回小程序可以从 bindcontact 回调中获得具体信息
share	触发用户转发
getPhoneNumber	获取用户手机号可以从bindgetphonenumber回调中获取到用户信息
launchApp	打开APP，可以通过app-parameter属性设定向APP传的参数
openSetting	打开授权设置页
feedback	打开“意见反馈”页面用户可提交反馈内容并上传日志开发者可以登录小程序管理后台后进入左侧菜单“客服反馈”页面获取到反馈内容
…	…

3.open-data标签

使用open-data可以不用用户授直接获取，用于展示微信开放的用户数据，所以如果你仅仅只是想展示用户信息的话，就，用它！用它！用它！= =毕竟代码少…

示例代码：

<!--wxml-->
	<!-- 获取头像 -->
	<open-data type="userAvatarUrl"></open-data>
	<!-- 获取昵称 -->
	<open-data type="userNickName" lang="zh_CN"></open-data>

元素说明：

属性	说明
type	开放数据类型
lang	当type="user"时生效，以哪种语言展示userInfo
…	…

type合法值

值	说明
userNickName	用户昵称
userAvatarUrl	用户头像
userGender	用户性别
userCity	用户所在城市
userProvince	用户所在省份
userCountry	用户所在国家
userLanguage	用户的语言
groupName	拉取群名称
…	…