微信登陆授权获取用户信息
微信登陆授权获取用户信息学习记录 wxml代码: <view wx:if="{{canIUse}}" class="mai"> <button class="but" open-type="getUserInfo" bindgetuserinfo="bindGetUserInfo">授权登录</button> <view class="med">-----------·-----------</view> <view class="txt">\t\t欢迎使用小程序,我们需要一些您公开的信息,包括微信昵称,头像等等,请放心,我们会妥善保管您的信息!</view> </view> <view wx:else>请升级微信版本</view> js代码: Page({ data: { canIUse: wx.canIUse('button.open-type.getUserInfo') }, /** * 生命周期函数--监听页面加载 */ onLoad: function (options) { //显示加载的图标 wx.showLoading({ title: '加载中', }) wx.login({ success(res){ if(res.code){ // //发起网络请求 // wx.request({ // url: 'https://test.com/onLogin', // data:{ // code:res.code // } // }) wx.getSetting({ success (res){ if (res.authSetting['scope.userInfo']) { // 已经授权,可以直接调用 getUserInfo 获取头像昵称 wx.getUserInfo({ success: function(res) { console.log(res.userInfo) getApp().globalData.userInfo = res.userInfo } }) } } }) }else { console.log('登陆失败' + res.errMsg) } } }) // 查看是否授权 setTimeout(function () { wx.hideLoading() },2000) }, bindGetUserInfo (e) { console.log(e.detail.userInfo) }, }) json代码: { "usingComponents": {}, "navigationBarBackgroundColor": "#F2F2F2", "navigationBarTitleText": "微信授权", "navigationBarTextStyle": "black" } wxss代码: /* pages/load/load.wxss */ .mai{ width: 80%; height: 300rpx; margin-top: 350rpx; margin-left: 10%; margin-right: 10%; } .but{ width: 70%; height: 80rpx; background-color: #04be01; border-radius: 10rpx; align-content: center; text-align: center; margin-left: 15%; margin-right: 15%; color: white; font-size: 37rpx; font-weight: bold; } .txt{ color: #8a8a8a; width: 92%; font-size: 32rpx; margin-top: 10rpx; margin: auto; font-weight: 10rpx; } .med{ color: #8a8a8a; font-size: 40rpx; text-align: center; margin-top: 20rpx; }