微信小程序获取用户信息及手机号(后端TP5.0)

本文实例为大家分享了微信小程序获取用户信息及手机号的具体代码,供大家参考,具体内容如下

wxml页面

<view wx:if="{{config.tipsshow1}}" class='dialog-container'>
 <view class='dialog-mask'></view>
 <view class='dialog-info'>
 <view class='dialog-title'>login prompt</view>
 <view class='dialog-content'>To provide better service, click "allow" in the prompt box later!</view>
 <view class='dialog-footer'>
  <button class='dialog-btn' open-type="getUserInfo" bindgetuserinfo="getUserInfo">I see.</button>
 </view>
 </view>
</view>

<view wx:if="{{config.tipsshow2}}" class='dialog-container'>
 <view class='dialog-mask'></view>
 <view class='dialog-info'>
 <view class='dialog-title'>login prompt</view>
 <view class='dialog-content'>To provide better service, click "allow" in the prompt box later!</view>
 <view class='dialog-footer'>
  <button class='dialog-btn' open-type="getPhoneNumber" bindgetphonenumber="getPhoneNumber">To authorize.</button>
 </view>
 </view>
</view>

wxss页面

.dialog-mask{
 position: fixed;
 z-index: 1000;
 top: 0;
 right: 0;
 left: 0;
 bottom: 0;
 background: rgba(0, 0, 0, 0.3);
}
.dialog-info{
 position: fixed;
 z-index: 5000;
 width: 80%;
 max-width: 600rpx;
 top: 50%;
 left: 50%;
 -webkit-transform: translate(-50%, -50%);
 transform: translate(-50%, -50%);
 background-color: #FFFFFF;
 text-align: center;
 border-radius: 3px;
 overflow: hidden;
}
.dialog-title{
 font-size: 36rpx;
 padding: 30rpx 30rpx 10rpx;
}
.dialog-content{
 padding: 10rpx 30rpx 20rpx;
 min-height: 80rpx;
 font-size: 32rpx;
 line-height: 1.3;
 word-wrap: break-word;
 word-break: break-all;
 color: #999999;
}
.dialog-footer{
 display: flex;
 align-items: center;
 position: relative;
 line-height: 90rpx;
 font-size: 34rpx;
}
.dialog-btn{
 display: block;
 -webkit-flex: 1;
 flex: 1;
 position: relative;
 color: #3CC51F;
}

js页面

data: {
 userName: '',
 pwd: '',
 getUserInfoFail: '',
 userInfo: [],
 hasUserInfo: '',
 phone: '',
 config: {
  tipsshow1: true,
  tipsshow2: false
 }
 },

 /**
 * 生命周期函数--监听页面加载
 */
 onLoad: function(options) {
 var that = this;
 //用户是否授权过手机号
 wx.getStorage({
  key: 'phone',
  success: function (res) {
  that.setData({
   config: {
   tipsshow1: false,
   tipsshow2: false
   },
  })
  }
 })

 //是否授权过用户信息
 wx.getSetting({
  success: function(res) {
  if (res.authSetting['scope.userInfo']) {
   // 已经授权,可以直接调用 getUserInfo 获取头像昵称
   wx.getUserInfo({
   success: function(res) {
    that.setData({
    userInfo: res.userInfo,
    config: {
     tipsshow1: false,
    },
    })
   }
   })
  }
  }
 })

 },

 getPhoneNumber: function(e) {
 if (e.detail.errMsg == "getPhoneNumber:fail user deny") return;
 //用户允许授权
 wx.showLoading()
 var self = this
 //1. 调用登录接口获取临时登录code
 wx.login({
  success: res => {
  console.log(res, 555)
  if (res.code) {
   //2. 访问登录凭证校验接口获取session_key、openid
   wx.request({
   url: "xxxxxxx/index/author/login",
   data: {
    'js_code': res.code,
   },
   method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
   header: {
    'content-type': 'application/json'
   }, // 设置请求的 header
   success: function(data) {
    console.log(data, data)
    if (data.statusCode == 200) {
    //3. 解密
    wx.request({
     url: 'xxxxxx/index/author/number',
     data: {
     'appid': data.data.appid,
     'sessionKey': data.data.session_key,
     'encryptedData': e.detail.encryptedData,
     'iv': e.detail.iv,
     },
     method: 'GET', // OPTIONS, GET, HEAD, POST, PUT, DELETE, TRACE, CONNECT
     header: {
     'content-type': 'application/json'
     }, // 设置请求的 header
     success: function(data2) {
     wx.hideLoading()
     console.log(data2.data.phoneNumber)
     if (data2.statusCode == 200 && data2.data.phoneNumber) {
      self.setData({
      phone: data2.data.phoneNumber,
      config: {
       tipsshow1: false,
       tipsshow2: false,
      },
      })
      wx.setStorageSync('phone', data2.data.phoneNumber);
      if (self.data.userInfo != '') {
      wx.request({
       url: 'xxxx/index/author/regist',
       data: {
       username: self.data.userInfo.nickName,
       sex: self.data.userInfo.gender,
       phone: self.data.phone,
       pwd: 123456,
       avatarimg: self.data.userInfo.avatarUrl
       },
       success: function(data) {
        console.log(data.data,56565)
        if (data.data != null) {
        wx.showToast({
         title: '登录中...',
         icon: 'loading',
         duration: 2000
        })
        wx.navigateTo({
         url: '../managementList/managementList'//管理页面
        })
        }
       }
      });
      }
      console.log(self.data, 526336)
     }
     },
     fail: function(err) {
     console.log(err);
     }
    })
    }
   },
   fail: function(err) {
    console.log(err);
   }
   })
  }
  }
 })
 },

 getUserInfo: function(e) {
 var that = this;
 console.log(e.detail.userInfo, "getuserinfo")
 if (e.detail.userInfo) {
  that.setData({
  userInfo: e.detail.userInfo,
  config: {
   tipsshow1: false,
   tipsshow2: true,
  },
  })
  console.log(that.data.userInfo);
 } else {
  console.log("获取信息失败")
 }
 },

PHP后端

<?php

namespace app\index\controller;

use think\Controller;
use app\admin\model\UserRecharge;
use think\Db;

class Author extends Controller
{

 /**
  * 发送HTTP请求方法
  * @param string $url 请求URL
  * @param array $params 请求参数
  * @param string $method 请求方法GET/POST
  * @return array $data 响应数据
  */
 function httpCurl($url, $params, $method = 'POST', $header = array(), $multi = false){
  date_default_timezone_set('PRC');
  $opts = array(
   CURLOPT_TIMEOUT  => 30,
   CURLOPT_RETURNTRANSFER => 1,
   CURLOPT_SSL_VERIFYPEER => false,
   CURLOPT_SSL_VERIFYHOST => false,
   CURLOPT_HTTPHEADER  => $header,
   CURLOPT_COOKIESESSION => true,
   CURLOPT_FOLLOWLOCATION => 1,
   CURLOPT_COOKIE   =>session_name().'='.session_id(),
  );
  /* 根据请求类型设置特定参数 */
  switch(strtoupper($method)){
   case 'GET':
    // $opts[CURLOPT_URL] = $url . '?' . http_build_query($params);
    // 链接后拼接参数 & 非?
    $opts[CURLOPT_URL] = $url . '?' . http_build_query($params);
    break;
   case 'POST':
    //判断是否传输文件
    $params = $multi ? $params : http_build_query($params);
    $opts[CURLOPT_URL] = $url;
    $opts[CURLOPT_POST] = 1;
    $opts[CURLOPT_POSTFIELDS] = $params;
    break;
   default:
    throw new Exception('不支持的请求方式!');
  }
  /* 初始化并执行curl请求 */
  $ch = curl_init();
  curl_setopt_array($ch, $opts);
  $data = curl_exec($ch);
  $error = curl_error($ch);
  curl_close($ch);
  if($error) throw new Exception('请求发生错误:' . $error);
  return $data;
 }
 /**
  * 微信信息解密
  * @param string $appid 小程序id
  * @param string $sessionKey 小程序密钥
  * @param string $encryptedData 在小程序中获取的encryptedData
  * @param string $iv 在小程序中获取的iv
  * @return array 解密后的数组
  */
 function decryptData( $appid , $sessionKey, $encryptedData, $iv ){
  $OK = 0;
  $IllegalAesKey = -41001;
  $IllegalIv = -41002;
  $IllegalBuffer = -41003;
  $DecodeBase64Error = -41004;
  if (strlen($sessionKey) != 24) {
   return $IllegalAesKey;
  }
  $aesKey=base64_decode($sessionKey);

  if (strlen($iv) != 24) {
   return $IllegalIv;
  }
  $aesIV=base64_decode($iv);

  $aesCipher=base64_decode($encryptedData);

  $result=openssl_decrypt( $aesCipher, "AES-128-CBC", $aesKey, 1, $aesIV);
  $dataObj=json_decode( $result );
  if( $dataObj == NULL )
  {
   return $IllegalBuffer;
  }
  if( $dataObj->watermark->appid != $appid )
  {
   return $DecodeBase64Error;
  }
  $data = json_decode($result,true);
  return $result;
 }

 /**
  * 请求过程中因为编码原因+号变成了空格
  * 需要用下面的方法转换回来
  */
 function define_str_replace($data)
 {
  return str_replace(' ','+',$data);
 }

 //获取手机号
 public function number($appid , $sessionKey, $encryptedData, $iv)
 {
  include_once (ROOT_PATH."./public/author/wxBizDataCrypt.php"); //引入 wxBizDataCrypt.php 文件
  $appid = $appid;
  $sessionKey = $sessionKey;
  $encryptedData= $encryptedData;
  $iv = $iv;
  $data = '';

  $pc = new \WXBizDataCrypt($appid, $sessionKey); //注意使用\进行转义
  $errCode = $pc->decryptData($encryptedData, $iv, $data );
  if ($errCode == 0) {
   print($data . "\n");
  } else {
   print($errCode . "\n");
  }
 }

 //微信登录
 public function login(){
  $get = input('get.');
  $param['appid'] = 'xxxxxxxxxx'; //小程序id
  $param['secret'] = 'xxxxxxxxxx'; //小程序密钥
  $param['js_code'] = $this->define_str_replace($get['js_code']);
  $param['grant_type'] = 'authorization_code';
  $http_key = $this->httpCurl('https://api.weixin.qq.com/sns/jscode2session', $param, 'GET');
  $session_key = json_decode($http_key,true);//获取openid和session_key
  //print_r(http_build_query($param));
  if (!empty($session_key['session_key'])) {
   $data['appid'] = $param['appid'];
   $data['session_key'] = $session_key['session_key'];
   return json($data);
  }else{
   echo '获取session_key失败!';
  }
 }

 //用户注册
 public function regist($username = "",$sex = "", $phone = "",$password = "",$avatarimg = "")
 {
  if ($phone){
   //判断该用户是否已经注册
   $userdata = Db::name('user')->where('phone',$phone)->find();
   if ($userdata){
    return json_encode(2);
   }

   //整合数组
   $salt = '1122';
   $password = Md5(Md5($password) . $salt);
   $data = [
    'name' => $username,
    'sex' => $sex,
    'phone' => $phone,
    'password' => $password,
    'avatarimg' => $avatarimg,
    'logtime' => date("Y-m-d H:i:s"),
    'addTime' => date("Y-m-d H:i:s")
   ];
   //注册新用户
   $userid = db('user')->insertGetId($data);
   if ($userid){
    return json_decode(1);
   }else{
    return json_encode(0);
   }
  }
 }
}

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持我们。

时间: 2019-09-11

微信小程序用户授权、位置授权及获取微信绑定手机号

1.位置授权 位置授权相对简单,可以直接调用方法wx.getLocation()就可以弹出授权框, 在调用前需要在app.json中设置用途说明 Page({ "permission": { "scope.userLocation": { "desc": "你的位置信息将用于xxx" } } }) 授权框 但是存在不少用户会拒绝授权,如果拒绝授权就不会再弹窗,而是直接进入接口 fail 回调,就要手动授权,我们可以通过自定义弹

微信小程序获取用户绑定手机号方法示例

用户调用wx.login()方法,获取登录用户凭证code wx.login({ success: function(res) { console.log('loginCode', res.code) } }); code传给后台,凭证code获取session_key和openid https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=aut

微信小程序getPhoneNumber获取用户手机号

 微信小程序getPhoneNumber获取用户手机号 小程序中有很多地方都会用到注册用户信息的地方,用户需要填写手机号等, 有了这个组件可以快速获取微信绑定手机号码,无须用户填写. 1.getPhoneNumber这个组件通过button来实现(别的标签无效).将button中的open-type="getPhoneNumber",并且绑定bindgetphonenumber事件获取回调. <button open-type="getPhoneNumber"

微信小程序获取手机号授权用户登录功能

小程序中有很多地方都会用到注册用户信息的地方,用户需要填写手机号等,有了这个组件可以快速获取微信绑定手机号码,无须用户填写. 1.getPhoneNumber这个组件通过button来实现(别的标签无效).将button中的open-type="getPhoneNumber",并且绑定bindgetphonenumber事件获取回调. <span style="font-size:14px;"><button open-type="get

微信小程序如何获取用户手机号

最近在做一款微信小程序,需要获取用户手机号,具体步骤如下: 流程图: 1.首先,客户端调用wx.login,回调数据了包含jscode,用于获取openid(用户唯一标识)和sessionkey(会话密钥). 2.拿到jscode后,将其发送给服务端,服务端拿它与微信服务端做交互获取openid和sessionkey.具体获取方法如下: (1)需要写一个HttpUrlConnection工具类: public class MyHttpUrlConnection { private final i

微信小程序如何获取用户信息

最近在研究微信小程序怎么玩的.接触后发现好多的坑. 比如在浏览器中我们可以通过document.getElementById 获取到页面的DOM对象.而在微信小程序中是获取不到DOM对象的.document.getElementById() 直接报错 getElementById not function 我也是醉了.不支持这个好多有趣的功能不能实现了. 言归正传,我谈下获取用户信息的感想. 有两种获取用户信息的方案. 1.不包含敏感信息openId 的json对象(包含:nickname.av

微信小程序实现获取用户信息并存入数据库操作示例

本文实例讲述了微信小程序实现获取用户信息并存入数据库操作.分享给大家供大家参考,具体如下: 微信小程序获取用户信息简单,但是在存入自己服务器数据库的过程中研究了一天多的时间,并且网上搜索不到该资源,故发出来供大家参考. index.js Page({ data: { nickName: "微信账号登录", avatarUrl:"./user-unlogin.png", }, onLoad: function () { var that = this; var nic

微信小程序如何获取用户头像和昵称

本文介绍了微信小程序如何获取用户头像和昵称,分享给大家,具体如下: 代码user.wxml: <view > <view> <image class="avatar" src='{{userInfo.avatarUrl}}'></image> <view class="nickname">{{userInfo.nickName}}</view> </view> </view&g

微信小程序授权获取用户详细信息openid的实例详解

小程序获取用户的头像昵称openid之类 第一种使用wx.getUserInfo直接获取微信头像,昵称 wx.getUserInfo({ success: function (res) { that.setData({ nickName: res.userInfo.nickName, avatarUrl: res.userInfo.avatarUrl, }) }, }) 第二种 我们在使用小程序wx.login API进行登录的时候,直接使用wx.getUserInfo是不能获取更多的信息的,如

微信小程序如何获取用户收货地址

获取用户收货地址需要用户点击授权,所以有两种情况,确认授权.取消授权. 情况一,用户第一次访问用户地址授权,并且点击确定授权. 情况二,用户点击取消授权后,再次获取授权 流程: (代码逻辑整理) 1.点击事件触发函数,获取用户当前设置 2.根据用户当前设置中的用户授权结果,判断是否包含收货地址授权 3.如果包含收货地址授权并且没有取消过收货地址授权,直接调用wx.chooseAddress(),获取用户收货地址. 4.取消过收货地址授权,调用wx.openSetting(),调起客户端小程序设置

微信小程序如何获取openid及用户信息

微信小程序获取openid及用户信息的方法 1. 获取openid 1.1 获取code 调用接口获取登录凭证(code)进而换取用户登录态信息,包括用户的唯一标识(openid) 及本次登录的会话密钥(session_key).用户数据的加解密通讯需要依赖会话密钥完成. wx.login({ //获取code success: function(res) { code = res.code //返回code } }) 1.2 获取openid 拿到上一步获取的code,结合小程序 appid

小程序最新获取用户昵称和头像的方法总结

前段时间微信小程序对获取用户昵称和头像方法进行了更新,网上很多的文章都已经不适用了,这里简单总结一下 首先,传统接口wx.getUserInfo的效果会弹出一个给用户的弹窗,需要用户授权,经过测试传统的wx.getUserInfo目前还是能用的,但是在使用时候会有官方log提醒你,这个方法需要升级. 然后就是官方提供的最新方法Open-data标签,使用这个标签可以不用用户授权直接获得头像和昵称 例子: <open-data type="userAvatarUrl"><

微信小程序如何通过用户授权获取手机号(getPhoneNumber)

这篇文章主要介绍了微信小程序如何通过用户授权获取手机号(getPhoneNumber),文中通过示例代码介绍的非常详细,对大家的学习或者工作具有一定的参考学习价值,需要的朋友可以参考下 小程序有一个获取用户很便捷的api,就是通过getPhoneNumber获取用户的已经绑定微信的手机号码.有一点要大家注意,现在微信和注重用户体验,有些方法都是需要用户主动去触发才能调用的,比如getPhoneNumber. 官方文档:https://developers.weixin.qq.com/minipr