gpt4 book ai didi

微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现

转载 作者:qq735679552 更新时间:2022-09-29 22:32:09 30 4
gpt4 key购买 nike

CFSDN坚持开源创造价值,我们致力于搭建一个资源共享平台,让每一个IT人在这里找到属于你的精彩世界.

这篇CFSDN的博客文章微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现由作者收集整理,如果你对这篇文章有兴趣,记得点赞哟.

这个接口只能获得一些非敏感信息,例如用户昵称,用户头像,经过用户授权允许获取的情况下即可获得用户信息,至于openid这些,需要调取wx.login来获取.

index.wxml 。

?
1
2
3
4
5
6
7
8
9
10
11
12
<!-- 当已经授权的时候 -->
< view wx:if = "{{result == 'ok'}}" class = "result" >
  < view class = "headimg" >
   < image src = "{{avatarUrl}}" ></ image >
  </ view >
  < view class = "nickname" >{{nickName}}</ view >
</ view >
<!-- 当未授权的时候 -->
< view wx:else class = "result" >
< view >未授权</ view >
< button wx:if = "{{canIUse}}" open-type = "getUserInfo" bindgetuserinfo = "bindGetUserInfo" >授权登录</ button >
</ view >

index.js 。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
38
39
40
41
Page({
  data: {
   canIUse: wx.canIUse( 'button.open-type.getUserInfo' )
  },
  onLoad: function () {
   var that = this ;
   // 查看是否授权
   wx.getSetting({
    success (res){
     if (res.authSetting[ 'scope.userInfo' ]) {
      // 已经授权,可以直接调用 getUserInfo 获取头像昵称
      wx.getUserInfo({
       success: function (res) {
        console.log(res.userInfo)
        that.setData({
         result: 'ok' , // 结果
         nickName:res.userInfo.nickName, // 微信昵称
         avatarUrl:res.userInfo.avatarUrl, // 微信头像
        })
       }
      })
     } else {
      // 未授权,结果返回null
      that.setData({
       result: 'null' , // 结果
      })
     }
    }
   })
  },
  // 请求API授权,获得用户头像和昵称
  bindGetUserInfo (e) {
   console.log(e.detail.userInfo.nickName)
   var that = this ;
   that.setData({
    result: 'ok' , // 结果
    nickName:e.detail.userInfo.nickName, // 微信昵称
    avatarUrl:e.detail.userInfo.avatarUrl, // 微信头像
   })
  }
})

index.wxss 。

?
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
button{
  margin : 30px auto 0 ;
}
.result{
  width : 200px ;
  margin : 20px auto ;
  text-align : center ;
}
.result .headimg{
  width : 200px ;
  height : 200px ;
  border-radius: 100px ;
  margin-bottom : 20px ;
}
.result .headimg image{
  width : 200px ;
  height : 200px ;
  border-radius: 100px ;
}

微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现

到此这篇关于微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现的文章就介绍到这了,更多相关小程序wx.getUserInfo授权内容请搜索我以前的文章或继续浏览下面的相关文章希望大家以后多多支持我! 。

原文链接:https://blog.csdn.net/weixin_39927850/article/details/108095465 。

最后此篇关于微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现的文章就讲到这里了,如果你想了解更多关于微信小程序wx.getUserInfo授权获取用户信息(头像、昵称)的实现的内容请搜索CFSDN的文章或继续浏览相关文章,希望大家以后支持我的博客! 。

30 4 0
Copyright 2021 - 2024 cfsdn All Rights Reserved 蜀ICP备2022000587号
广告合作:1813099741@qq.com 6ren.com