组件:手机号快速验证组件
适用对象:企业/个体
费用:0.03元/次
目录
- 前言
- 思路
- 前端
- 后端代码
- 无感登录
- onload事件
- 无感登录方法
- 登录判断
- 后端
- mini_login2
- 最后
前言
最近注册了公司,可以注册具有支付能力的小程序了,各种材料加备案、认证差不多花了一个月的时间,打算接入支付后,接入一个快速注册的组件,给用户带来便捷的操作体验,发现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爬虫脚本项目实战