微信小程序授权登录全过程解析（附代码）

1. 服务器端接收到请求后，会去调用 auth.code2Session 接口，换取 用户唯一标识 OpenID 和 会话密钥 session_key。
2. 至此，登录流程才真正的结束了。

这是还没有登陆的界面 index.wxml

<view>
  <!-- 页面头部-->
  <view class="userinfo">
     <button wx:if="{
          
   {!hasUserInfo && canIUse}}" open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 点击登录 </button>
    <block wx:else>
      <view class="userinfo-nickname">
        <view class="TopTitle">{
          
   {
          
   userInfo.nickName}}</view>
        <view style="color:{
          
   {color}}" class="TopSubtitle">{
          
   {
          
   TopText}}</view>
      </view>
      <image bindtap="bindViewTap" class="userinfo-avatar" src="{
          
   {userInfo.avatarUrl}}" mode="cover"></image>
      <image class="TopArrow" src="{
          
   {/pages/image/right.png}}" mode="heightFix"></image>
 
</view>

index.js

getUserInfo: function(e) {
          
   
    let biaozhi=this
    wx.login({
          
   
      success (res) {
          
   
        //res.code可以理解为是一个字符串
        console.log(res.code)
        wx.setStorage({
          
   
          key:"code",
          data:res.code
        })
        wx.getUserInfo({
          
   
          success:function(e){
          
   
              console.log(e.userInfo)
             app.globalData.userInfo=e.userInfo
             biaozhi.setData({
          
   
               userInfo:e.userInfo,
               hasUserInfo:true
               
             })
             //console.log(biaozhi.userInfo)
            if (res.code) {
          
   
              //发起网络请求
              wx.request({
          
   
                url: 自己写的api,
                data: {
          
   
                  code: res.code
                },
                header:{
          
   
                  content-type:application/json//默认值
                },
                method:GET,
                success(ress) {
          
   
                  console.log(ress);
                 
                  wx.setStorage({
          
   
                    key:"session_id",
                    data:ress.data.session_key
                  })
                  wx.setStorage({
          
   
                    key:"openid",
                    data:ress.data.openid
                  })
                }
              })
            } else {
          
   
              console.log(登录失败！ + res.errMsg)
            }
          },
          fail:function(e){
          
   
            console.log("有大问题")
          }  
                 
        })
        
      }
    })
  },

登陆后效果：