微信小程序?qū)崿F(xiàn)授權(quán)登錄之獲取用戶信息

更新時間：2022年05月22日 11:18:53 作者：我啊困的唉

這篇文章主要介紹了微信小程序?qū)崿F(xiàn)授權(quán)登錄之獲取用戶信息，文中示例代碼介紹的非常詳細，具有一定的參考價值，感興趣的小伙伴們可以參考一下

本文實例為大家分享了微信小程序?qū)崿F(xiàn)獲取用戶信息的具體代碼，供大家參考，具體內(nèi)容如下

小程序登錄

小程序可以通過微信官方提供的登錄能力方便地獲取微信提供的用戶身份標(biāo)識，快速建立小程序內(nèi)的用戶體系。

登錄流程時序

效果展示：

功能實現(xiàn)：

新建一個login頁面

login.js：

wx.getUserProfile用于獲取用戶信息

wx.getStorageSync（）用于獲取緩存，進入小程序時調(diào)用

wx.setStorageSync（）用于保存緩存，保存登錄信息，下次進入小程序自動登錄

Page({
? data:{
? ? userInfo:'',
??
? },
? onLoad(){
? ? ?let user=wx.getStorageSync('user')
? ? ?this.setData({
? ? ? ?userInfo:user
? ? ?})
? },
? login(){
? ??
? ? console.log('點擊事件執(zhí)行了')
? ? wx.getUserProfile({
? ? ? desc: '必須授權(quán)才能使用',
? ? ? success:res=>{
? ? ? ? let user=res.userInfo
? ? ? ? wx.setStorageSync('user', user)
? console.log('成功',res)
? this.setData({
? ? userInfo:user
? })
? },
? ? ? fall:res=>{
? ? ? ? console.log('失敗',res)
? ? ? }
? ? })
??
? },
? nologin(){
? ?this.setData({
? ? ?userInfo:''
? ?})
? ?wx.setStorageSync('user', null)
? }
})

login.wxml:

<!--登錄-->
? <button ?wx:if="{{!userInfo}}" bindtap="login">登錄</button>
? <view wx:else class="root">
? ? <image class="touxiang" src="{{userInfo.avatarUrl}}"></image>
? ? <text class="nicheng">{{userInfo.nickName}}</text>
? </view>
<!--退出登錄-->
<view ?wx:if="{{userInfo}}">
? ? ? ? <button bindtap="nologin" >
? ? ? ? ? ? <text>退出登錄</text>
? ? ? ? </button>
</view>

login.wxss:

.touxiang {
? width: 150rpx;
? height: 150rpx;
? border-radius: 50%;
? margin-top: 20rpx;
? margin-bottom: 10rpx;
? margin-left: 40%;
}
.nicheng{
? color:white;
}

json文件無需更改。

以上就是本文的全部內(nèi)容，希望對大家的學(xué)習(xí)有所幫助，也希望大家多多支持腳本之家。

您可能感興趣的文章: