[小程序开发] 获取微信头像、微信昵称

一、获取微信头像

        1、将button组件open-type的值设置为chooseAvatar。

<view>
	<button class="btn" open-type="chooseAvatar" bindchooseavatar="chooseAvatar">
		<image class="avatar" src="{{avatarUrl}}" mode=""/>
	</button>
</view>

        2、通过bindchooseavatar时间回调获取到头像信息的临时路径。

chooseAvatar(event){
        const{avatarUrl}=event.detail
        this.setData({
            avatarUrl:avatarUrl
        })
    }

目前获取的微信头像是临时路劲,临时路径是有失效时间的,在实际开发中,需要将临时路径上传到公司的服务器。

二、获取微信昵称 

        1、通过form组件中包裹住input以及form-type为submit的button组件。

        2、需要将input组件type的值设置为nickname,当用户输入框输入时,键盘上方会展示微信昵称。

<form bindsubmit="onSubmit">
	<!-- 添加name属性,form组件会自动收集带有name属性的表单元素的值 -->
	<input type="nickname" name="nickname" placeholder="请输入昵称"/>
	<!-- 设置form-type="submit",将按钮变为提交按钮,点击按钮会触发表单的bindsubmit提交事件 -->
	<button type="primary" plain form-type="submit">
		点击获取昵称
	</button>
</form>

        3、给form绑定submit事件,在事件处理函数中通过事件对象获取用户昵称。

onSubmit(event){
        // console.log(event)
        const{nickname}=event.detail.value
        console.log(nickname)
    }

 

  • 4
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
要在微信小程序获取用户的头像昵称,可以通过调用微信提供的接口来实现。以下是获取用户头像昵称的步骤: 1. 在小程序的页面中,使用`wx.getUserInfo`方法获取用户的基本信息,包括头像昵称等。示例代码如下: ```javascript wx.getUserInfo({ success: function(res) { var userInfo = res.userInfo; var nickName = userInfo.nickName; // 用户昵称 var avatarUrl = userInfo.avatarUrl; // 用户头像图片链接 // 这里可以将获取到的信息保存到本地或发送到服务器进行处理 } }); ``` 2. 在小程序的`app.js`或需要使用用户信息的页面中,需要在`onLaunch`或`onLoad`方法中调用`wx.login`方法获取用户的登录凭证code。示例代码如下: ```javascript wx.login({ success: function(res) { if (res.code) { // 登录成功,获取到用户的登录凭证code var code = res.code; // 这里可以将code发送到服务器进行处理,用于换取用户的openid等信息 } else { console.log('登录失败!' + res.errMsg); } } }); ``` 需要注意的是,获取用户信息和登录凭证code的接口都需要用户授权才能调用成功。在小程序的`app.json`文件中,需要添加`scope.userInfo`和`scope.login`权限,示例代码如下: ```json { "pages": [ "pages/index/index" ], "permission": { "scope.userLocation": { "desc": "你的位置信息将用于小程序定位" }, "scope.userInfo": { "desc": "你的头像、称等信息将用于小程序展示" }, "scope.login": { "desc": "你的登录凭证将用于小程序登录" } } } ``` 这样,当用户打开小程序时,弹出授权提示框,让用户授权获取头像昵称的权限。用户授权后,就可以成功获取到用户的头像昵称信息了。

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

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

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值