【uniapp】微信小程序2024手机号快速验证及无感登录教程(内附代码)

发布于：2024-04-25 ⋅ 阅读:(21) ⋅ 点赞:(0)

组件：手机号快速验证组件
适用对象：企业/个体
费用：0.03元/次

目录

前言

最近注册了公司，可以注册具有支付能力的小程序了，各种材料加备案、认证差不多花了一个月的时间，打算接入支付后，接入一个快速注册的组件，给用户带来便捷的操作体验，发现uniapp的文档不多，于是自己踩了坑，本次简单记录一下，方便以后使用回顾

思路

手机号快速验证->数据库判断是否有数据->没有则注册；有的话直接登录，并将无感登录的oepnid记录下来，下次用户点击快速注册先通过openid进行查询完成无感登录，节省验证费用开支

前端

uniapp建议用下面代码，用微信官方的调用不起来

<!-- #ifdef MP-WEIXIN -->
<button  type="primary" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机号一键登录</button>
<!-- #endif -->

方法

获取到手机号后存储在本地，手机号进行检测，有记录pass没有则入库

getPhoneNumber(e) {
    console.log(e.detail.code) // 动态令牌
    let that = this;
    uni.request({
        url: 'https://******/api/mini_getuserphone.php',
        data: {
            phonecode: e.detail.code
        },
        method: 'POST',
        header: {
            'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
        },
        success: (res) = >{
            console.log(res.data.data) if (res.data.code == 100) {
                uni.showToast({
                    title: res.data.msg,
                    icon: 'none'
                });

            } else if (res.data.code == 200) {
                //返回数据接收成功
                uni.showToast({
                    title: res.data.msg,
                    icon: 'none'
                });
                var errcode = res.data.data['errcode'];
                if (errcode == 0) {
                    //登陆成功
                    var openids = res.data.data['phone_info']['phoneNumber'];
                    //注册事件
                    // 跳转事件
                    uni.setStorageSync('openid', openids);
                    //注册判断携带unionid
                    const unionid = uni.getStorageSync('unionid');

                    that.mini_userphoneregidst(openids, unionid);
                    setTimeout(function() {
                        // 调用全局MQTT连接函数，进行MQTT连接
                        getApp().check_account_mqtt_connect();
                        uni.switchTab({
                            url: '/pages/index/index'
                        });
                    },
                    1200);

                } else {
                    uni.showToast({
                        title: res.data.data['errmsg'],
                        icon: 'none'
                    });
                }

            }
        }
    })

},

后端代码

注意：grant_type为client_credential和无感登录获取openid不一样

//mini_getuserphone.php
<?php
$phonecode=$_POST['phonecode'];


if ($phonecode) {
           
            $appid='wxcbf*******dbea';//小程序id
            $secret='87616ba8******c4589bf';//密钥
            $url="https://api.weixin.qq.com/cgi-bin/token?appid=$appid&secret=$secret&grant_type=client_credential";
             $header = array(
       'Accept: application/json',
    );
    $curl = curl_init();
    //设置抓取的url
    curl_setopt($curl, CURLOPT_URL, $url);
    //设置头文件的信息作为数据流输出
    curl_setopt($curl, CURLOPT_HEADER, 0);
    // 超时设置,以秒为单位
    curl_setopt($curl, CURLOPT_TIMEOUT, 1);
 
    // 超时设置，以毫秒为单位
    // curl_setopt($curl, CURLOPT_TIMEOUT_MS, 500);
 
    // 设置请求头
    curl_setopt($curl, CURLOPT_HTTPHEADER, $header);
    //设置获取的信息以文件流的形式返回，而不是直接输出。
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
    //执行命令
    $data = curl_exec($curl);
 
    // 显示错误信息
    if (curl_error($curl)) {
        print "Error: " . curl_error($curl);
          die(
        json_encode(
            array(
            'code' => 100,
            'data' => '',
            'msg' => '请求出错！'
        ),480));
    } else {
        // 打印返回的内容
        $result=json_decode($data,true);
        if (array_key_exists("errcode",$result))
          {
        //   echo "键存在！";
       
         die(
        json_encode(
            array(
            'code' => 100,
            'data' => '',
            'msg' => '获取token失败！'.$result['errmsg']
        ),480));
        
          }
        else
          {
      //token获取成功 继续获取手机号
      $access_token=$result['access_token'];
      curl_close($curl);
      
      
    //   请求新的连接
$url = "https://api.weixin.qq.com/wxa/business/getuserphonenumber?access_token=" . $access_token;

$data = array('code' => $phonecode); // 请确保$code变量已经定义

$options = array(
    'http' => array(
        'header' => "Content-Type: application/json\r\n",
        'method' => 'POST',
        'content' => json_encode($data)
    )
);

$context = stream_context_create($options);
$response = file_get_contents($url, false, $context);

$result = json_decode($response, true);

          

        
    //   请求新的连接
    
         die(
        json_encode(
            array(
            'code' => 200,
            'data' => $result,
            'msg' => ''
        ),480));
          }
          
    }


          
} 
else {
            // 已被处理或者不存在 请求重新登陆
            die(
        json_encode(
            array(
            'code' => 100,
            'data' => '',
            'msg' => '非法操作'
        ),480)
);
        }
curl_close($curl);

无感登录

一键登录成功后，将openid记录到数据库，用户在点击收取按登陆前进行调用判断，可以省去一笔开支

onload事件

onShow() {
	// #ifdef MP-WEIXIN
	//小程序登录检测
	this.mini_login()
	// #endif

},

无感登录方法

mini_login() {
	let that = this;

	uni.login({
		provider: 'weixin',
		success: loginRes => {
			console.log(loginRes);
			that.code = loginRes.code;
			// 2. 将用户登录code传递到后台置换用户SessionKey、OpenId等信息
			uni.request({
				url: 'https://dcloud.taila.club/api/mini_login2.php', //仅为示例，并非真实接口地址。
				data: {
					code: loginRes.code
				},
				method: 'POST',
				header: {
					'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
				},
				success: (res) => {
					console.log(res.data);

					uni.hideLoading()
					if (res.data.code == 200) {
						//存取session
						uni.setStorageSync('unionid', res.data.data.openid);
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						});


						//判断逻辑
						that.pd_login(res.data.data.openid);


					} else {
						uni.showToast({
							title: res.data.msg,
							icon: 'none'
						})
					}


				}
			});


		},
		fail: () => {
			uni.showToast({
				title: '获取 code 失败',
				icon: 'none'
			});
		}
	});

},

登录判断

pd_login(unionid) {
	let that = this;
	uni.request({
		url: 'https://******/mini_login_check.php',
		data: {
			unionid: unionid
		},
		method: 'POST',
		header: {
			'content-type': 'application/x-www-form-urlencoded' //自定义请求头信息
		},
		success: (res) => {
			console.log(res.data)
			if (res.data.code == 201) {
				//unionid在数据库没有记录 记录就可以不需要操作
				console.log('unionid在数据库没有记录 记录就可以不需要操作')
			} else if (res.data.code == 200) {
				var openids = res.data.data;
				uni.showModal({
					title: '提示',
					content: '检测到该账户已授权是否直接登录？',
					success: function(res) {
						if (res.confirm) {
							//登陆成功 由于之前开发问题openid就是手机号、账号 ||unionid才是真真的openid
							uni.setStorageSync('openid', openids);
							uni.setStorageSync('unionid', unionid);
							// 调用全局MQTT连接函数，进行MQTT连接
							getApp()
								.check_account_mqtt_connect();
							uni.switchTab({
								url: '/pages/my/my'
							});
						} else if (res.cancel) {
							console.log('用户点击取消');
						}
					}
				});
			}
		}
	})
},

后端

<?php
include 'conn.php';
header("Content-type:text/html;charset=utf-8");//字符编码设置
if (!$_POST) {
   die(
        json_encode(
            array(
            'code' => 400,
            'msg' => '缺少参数'
        ),480)
);
} 

$unionid=$_POST['unionid'];
$sql="SELECT * FROM `user` WHERE `UnionID` = '$unionid'";
// 执行查询
$result = $conn->query($sql);


if ($roows=mysqli_fetch_assoc($result)) {
  //success
   // 查到数据直接返回手机号进行登录
 echo json_encode(array('code' => 200, 'msg' => '登陆成功', 'data' => $roows['openid']));
 
} else {
  //fail
  // 查不到数据
echo json_encode(array('code' => 201, 'msg' => '尚未注册', 'data' => ''));
}

mini_login2


<?php
$code=$_POST['code'];
if ($code) {
           
            $appid='wx*****a';//小程序id
            $secret='876*********89bf';//密钥
            $url="https://api.weixin.qq.com/sns/jscode2session?appid=$appid&secret=$secret&js_code=$code&grant_type=authorization_code";
             $header = array(
       'Accept: application/json',
    );
    $curl = curl_init();
    //设置抓取的url
    curl_setopt($curl, CURLOPT_URL, $url);
    //设置头文件的信息作为数据流输出
    curl_setopt($curl, CURLOPT_HEADER, 0);
    // 超时设置,以秒为单位
    curl_setopt($curl, CURLOPT_TIMEOUT, 1);
 
    // 超时设置，以毫秒为单位
    // curl_setopt($curl, CURLOPT_TIMEOUT_MS, 500);
 
    // 设置请求头
    curl_setopt($curl, CURLOPT_HTTPHEADER, $header);
    //设置获取的信息以文件流的形式返回，而不是直接输出。
    curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
    curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false);
    curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false);
    //执行命令
    $data = curl_exec($curl);
 
    // 显示错误信息
    if (curl_error($curl)) {
        print "Error: " . curl_error($curl);
          die(
        json_encode(
            array(
            'code' => 100,
            'data' => '',
            'msg' => '请求出错！'
        ),480));
    } else {
        // 打印返回的内容
        $result=json_decode($data,true);
        if (array_key_exists("errcode",$result))
          {
        //   echo "键存在！";
       
         die(
        json_encode(
            array(
            'code' => 100,
            'data' => '',
            'msg' => '获取token失败！'.$result['errmsg']
        ),480));
        
          }
        else
          {
        //   echo "键不存在！";
              // 开启redius
       
         //写入redius session_key名命的openid数据 默认存储2天
        curl_close($curl);
         die(
        json_encode(
            array(
            'code' => 200,
            'data' => $result,
            'msg' => '获取token成功'
        ),480));
          }
          
    }


          
} 
else {
            // 已被处理或者不存在 请求重新登陆
            die(
        json_encode(
            array(
            'code' => 100,
            'data' => '',
            'msg' => '非法操作'
        ),480)
);
        }

最后

《记一次云之家签到抓包》
《记一次视频抓包m3u8解密过程》
《抓包部分软件时无网络+过代理检测 解决办法 安卓黄鸟httpcanary+vmos》
《Python】记录抓包分析自动领取芝麻HTTP每日免费IP（成品+教程）》
《某课抓包视频 安卓手机：黄鸟+某课app+VirtualXposed虚拟框架》

推荐专栏：

《Python爬虫脚本项目实战》

该专栏往期文章：
《【Python爬虫项目实战一】获取Chatgpt3.5免费接口文末付代码（过Authorization认证）》

🥦如果感觉看完文章还不过瘾，欢迎查看我的其它专栏
🥦作者对python有很大的兴趣，完成过很多独立的项目：例如滇医通等等脚本，但是由于版权的原因下架了，爬虫这一类审核比较严谨，稍有不慎就侵权违规了，所以在保证质量的同时会对文章进行筛选

如果您对爬虫感兴趣请收藏或者订阅该专栏哦《Python爬虫脚本项目实战》，如果你有项目欢迎联系我，我会同步教程到本专栏！

🚀Python爬虫项目实战系列文章！！
⭐⭐欢迎订阅⭐⭐

【Python爬虫项目实战一】获取Chatgpt3.5免费接口文末付代码（过Authorization认证）
【Python爬虫项目实战二】Chatgpt还原验证算法-解密某宝伪知网数据接口

⭐⭐欢迎订阅⭐⭐
在这里插入图片描述

Python爬虫脚本项目实战
在这里插入图片描述

网站公告

今日签到

点亮在社区的每一天
去签到

热门文章

最新发布