微信小程式擷取手機号授權登入

背景：

public function login(Request $request)
    {
        $code=$request['code'];
//        dd($code);
        $appid='wx101e36c98383213e';
        $server='e7005b757195845b865723d871142fce';
        $url='https://api.weixin.qq.com/sns/jscode2session?appid=%s&secret=%s&js_code=%s&grant_type=authorization_code';
        $url = sprintf($url, $appid, $server, $code);
        $client=new Client(['timeout'=>5,'verify'=>false]);
        $res=$client->get($url);
//        dd($res);
        $ret=(string)$res->getBody();

        $arr=json_decode($ret,true);
//        return  $arr;die;
        try {
            $res=DB::table('user')->insert(['openid'=>$arr['openid']]);
            return $res;
        }catch (\Exception $exception){
            return $arr;
        }

    }
    public function wxlogin(Request $request)
    {
        $openid=$request['openid'];
        $data=User::where('openid',$openid)->first();
        if ($data){
            return json_encode($data);
        }else{
            $data=User::create(['openid'=>$openid]);
            return json_encode($data);
        }
    }
    public function phone(Request $request)
    {
        include_once "wxBizDataCrypt.php";


        $appid = 'wx101e36c98383213e';
        $sessionKey = $request['session_key'];

        $encryptedData=$request['encryptedData'];
        $iv = $request['iv'];

        $pc = new WXBizDataCrypt($appid, $sessionKey);
        $errCode = $pc->decryptData($encryptedData, $iv, $data );

        if ($errCode == 0) {
            print($data . "\n");
        } else {
            print($errCode . "\n");
        }
    }
    public function phonelogin(Request $request)
    {
        $data=User::where('phone',$request['phone'])->first();
        if ($data){
            return json_encode($data);
        }else{
            $data=User::where('openid',$request['openid'])->update(['phone'=>$request['phone']]);
            $data=$data->where('phone',$request['phone'])->first();
            return json_encode($data);
        }
    }
           

xml頁面

<view class="container">

  <view class="userinfo">

    <block wx:if="{{!hasUserInfo}}">

      <button wx:if="{{canIUseGetUserProfile}}" bindtap="getUserProfile"> 擷取頭像昵稱 </button>

      <button wx:else open-type="getUserInfo" bindgetuserinfo="getUserInfo"> 擷取頭像昵稱 </button>

      <button open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">擷取手機号</button>

    </block>

    <block wx:else>

      <image bindtap="bindViewTap" class="userinfo-avatar" src="{{userInfo.avatarUrl}}" mode="cover"></image>

      <text class="userinfo-nickname">{{userInfo.nickName}}</text>

    </block>

  </view>

</view>
           

xss:

.userinfo {

  display: flex;

  flex-direction: column;

  align-items: center;

  color: #aaa;

}



.userinfo-avatar {

  overflow: hidden;

  width: 128rpx;

  height: 128rpx;

  margin: 20rpx;

  border-radius: 50%;

}



.usermotto {

  margin-top: 200px;

}

           

js:

data: {

    userInfo: {},

    hasUserInfo: false,

    canIUseGetUserProfile: false,

  },



  /**

   * 生命周期函數--監聽頁面加載

   */

  onLoad: function (options) {

    

    if (wx.getUserProfile) {

      this.setData({

        canIUseGetUserProfile: true

      })

    }

},

getUserProfile(e) {



let openid=wx.getStorageSync('openid')



// 推薦使用wx.getUserProfile擷取使用者資訊，開發者每次通過該接口擷取使用者個人資訊均需使用者确認

// 開發者妥善保管使用者快速填寫的頭像昵稱，避免重複彈窗

    wx.getUserProfile({

     desc: '用于完善會員資料', 

     // 聲明擷取使用者個人資訊後的用途，後續會展示在彈窗中，請謹慎填寫



         

     success: (res) => {



        // console.log(res.userInfo);

        wx.request({

          url: 'http://localhost/index.php/api/wxlogin',

          data:{openid},

          success:e=>{

            // console.log(e)

          }

        })

     this.setData({

      userInfo: res.userInfo,

        hasUserInfo: true

      })

    }

     })

    },

   getUserInfo(e) {  

   // 不推薦使用getUserInfo擷取使用者資訊，預計自2021年4月13日起，getUserInfo将不再彈出彈窗，并直接傳回匿名的使用者個人資訊

     this.setData({

      userInfo: e.detail.userInfo,

      hasUserInfo: true

    }) 

          

  },





  getPhoneNumber (e) {

    let session_key =wx.getStorageSync('session_key')

    let openid =wx.getStorageSync('openid')



    // console.log(e)

    console.log(e.detail.errMsg)

    console.log(e.detail.iv)

    console.log(e.detail.encryptedData)

    wx.request({

      url: 'http://localhost/index.php/api/phone',

      data:{

        encryptedData:e.detail.encryptedData,

        iv:e.detail.iv,

        session_key:session_key

      },

      success:ret=>{

        console.log(ret)

        wx.request({

          url: 'http://localhost/index.php/api/phonelogin',

          data:{

            openid:openid,

            phone:ret.data.purePhoneNumber

          },

          success:evt=>{

            console.log(evt);

            this.setData({

              userInfo:evt.data,

              hasUserInfo:true

            })

          }

        })

      }



    })



 app.js
App({
  onLaunch() {
    // 展示本地存儲能力
    const logs = wx.getStorageSync('logs') || []
    logs.unshift(Date.now())
    wx.setStorageSync('logs', logs)

    // 登入
    wx.login({
      timeout:2000,
      success: ({code}) => {
        // console.log(code)
       wx.request({
         url: 'http://localhost/index.php/api/login',
         data:{code},
         method:'POST',
         success:e=>{
           console.log(e)
           wx.setStorageSync('openid', e.data.openid)
           wx.setStorageSync('session_key', e.data.session_key)
          //  console.log(e.data.session_key);
         }
       })
      }
    })
  },
  globalData: {
    userInfo: null
  }
})