微信授权小程序是啥？

Posted 2023-05-04

参考技术A

微信小程序手机号授权是在微信里打开小程序时弹窗请求允许使用某些功能，比如授权获取用户信息、授权获取手机号等，标题会显示“微信授权”。
微信（wechat）是腾讯公司于2011年1月21日推出的一个为智能终端提供即时通讯服务的免费社交程序，微信支持跨通信运营商、跨操作系统平台通过网络快速发送免费（需消耗少量网络流量）语音短信、视频、图片和文字，同时，也可以使用通过共享流媒体内容的资料和基于位置的社交插件“摇一摇”、“漂流瓶”、“朋友圈”、“公众平台”、“语音记事本”等服务插件。
微信提供公众平台、朋友圈、消息推送等功能，用户可以通过“摇一摇”、“搜索号码”、“附近的人”、扫二维码方式添加好友和关注公众平台，同时微信将内容分享给好友以及将用户看到的精彩内容分享到微信朋友圈。截止2016年12月微信的月活跃用户数已达8.89亿。2018年6月20日，微信订阅号正式改版上线。2019年11月，“腾讯QQ”的小程序在微信上线。

微信小程序入门之授权登录

微信小程序

一.实现微信小程序授权登录
微信小程序每次获得用户的信息时需要授权登录,下面的代码可以实现以下功能

Page(
  data: 
    nickName:''
  ,
  dianji()
   
    console.log("点击了按按钮")
    wx.getUserProfile(
       desc: '获取用户的信息',//获取用户的信息
       success:res => //用户成功授权
        console.log("成功",res)
        this.setData(
          nickName:res.userInfo.nickName,
          touxian:res.userInfo.avatarUrl
        )
    ,
    fail:res=>
      console.log("失败",res)
    
  )
)

结果：

使得登录后可以隐藏点击按钮：
在js文件里面增加以下代码

Page(
  data: 
   userInfo:""
  ,
  dianji()
   
    console.log("点击了按按钮")
    wx.getUserProfile(
       desc: '获取用户的信息',
       success:res => 
         let user=res.userInfo
        console.log("成功",res)
        this.setData(
          userInfo:user   
        )
    ,
    fail:res=>
      console.log("失败",res)
    
  )
)

在wxml里面的代码：

<button wx:if="!userInfo"   bindtap="dianji" >点击</button>
<view wx：else class="root">
     <image class="touxian"  src="userInfo.avatarUrl"></image>
     <text>userInfo.nickName</text>
</view>

理解：
设定条件，由于一开始userInfo为空，所以执行button命令，点击授权之后，userInfo获得了数据所以执行里面的内容。
退出点击按钮的操作：
在之前的代码下面增加一段，同时也要在wxml里面增加相应的操作
js：

 tui()
   this.setData(
    userInfo:""
   )
 

wxml：

  <button bindtap="tui" >退出登录</button>

二.对登录的信息进行缓存
用户在使用微信小程序时，可能需要对用户以前提交的信息进行保存，方便用户的操作，所以对用户登录的信息进行缓存十分重要。
主要是使用了微信小程序里面的这一端代码：
wx.setStorageSync(‘参数1’, 参数2)
上面的参数1其实就是相对与一个用来保存参数2里面内容的地方，可以在微信开发者里面看到缓存的内容：

同时得到保存地方的内容可以用以下代码：
wx.getStorageSync(‘参数1’)

具体实现：

Page(
  data: 
   userInfo:""
  ,
  onLoad()
    let user=wx.getStorageSync('user1')
    console.log("1",user)
    this.setData(
      userInfo:user
    )
  ,
  dianji()
    console.log("点击了按按钮")
    wx.getUserProfile(
       desc: '获取用户的信息',
       success:res => 
         let user=res.userInfo
         wx.setStorageSync('user1', user)
        console.log("成功",res)
        this.setData(
          userInfo:user   
        )
    ,
    fail:res=>
      console.log("失败",res)
    
  ),
 tui()
   this.setData(
    userInfo:""
   )
   wx.setStorageSync('user1', null)
 
)

结果就是每次进入小程序可以保存用户的相关信息，不用总是点击登录输入相关的信息