小程序可以通过微信官方提供的登录能力方便地获取微信提供的用户身份标识,快速建立小程序内的用户体系。
登录流程时序
第一步也是最重要的一部 微信小程序页面
代码
<!-- 只有写了button按钮 才可以发起授权 才可以完成后面的登录 -->
<button bind:tap="getUserProfile">授权</button>
第二步编写小程序的逻辑代码 微信小程序js代码
/**
* 保存新建的资源
* @param Request $request
* @return void
* @author gj
* @date 2021-06-01
*/
Page({
/**
* 页面的初始数据
*/
data: {
//定义好初始数据 后面请求接口用得到
//用户的总信息
userInfo: {},
//用户的头像链接
avatarUrl: '',
//用户的昵称
nickname: '',
},
//开始写授权的逻辑
getUserProfile(e) {
//拉起授权框
wx.getUserProfile({
//用于后期授权框改版的提示
desc: '用于完善用户信息',
//如果用户点击允许执行的操作
success: (res) => {
// console.log(res.userInfo)
//用户点击允许后 会获取用户的一些信息 赋值给data
this.setData({
userInfo: res.userInfo,
nick_name: res.userInfo.nickName,
avatarUrl: res.userInfo.avatarUrl,
})
wx.login({
success: (res) => {
//因为获取用户的标识需要code码 所以 在有了用户信息以后 开始获取code码
// 获取code码
var code = res.code;
var userInfo = this.data.userInfo
var nickname = this.data.nick_name
var url = this.data.avatarUrl
// console.log(nickname);
//判断是否获取到code码
if (code) {
//取到code码以后开始最重要的一步 请求后台接口 获取openID 和session_key
wx.request({
url: 'http://www.gj.com/Api', //开发者服务器接口地址",
//因为我的路由时post请求方式 所以子啊data写我需要传的值
data: {
code: code,
nickname: nickname,
url: url
}, //请求的参数",
method: 'POST',
dataType: 'json', //如果设为json,会尝试对返回
success: res => {
//接受接口返回的数据
//console.log(res.data.data);
//如果状态码==200 说明登录成功
if (res.data.code == 200) {
//存取用户的 token 到缓存 方便后期再次请求确认用户
wx.setStorageSync('token', res.data.data, 7200 - 60);
wx.switchTab({
url: '/pages/one/one'
})//登录成功跳转底部选项卡我的页面
}
},
});
}
}
})
},
})
},
})
后台接口代码 我使用的时tp6 使用tp5 请注意 session 在tp5中设置过期时间需要自行修改配置
public function save()
{
// 接值
$data = input();
//验证参数 自行验证
//使用小程序传过来的code码调用封装的小程序请求 获取openID 和session_key 用来区别用户
$result = getWx($data);
// 拼接需要添加搭配用户表的数据
$addUser['session_key'] = $result['session_key'];
$addUser['openid'] = $result['openid'];
$addUser['name_nick']=$data['nickname'];
$addUser['url'] = $data['url'];
// 根据opecID 查看用户表是否有这个用户
$userRes = UserModel::getOneUserData($addUser['openid']);
//没有用户 添加用户信息到数据库
if (!isset($userRes['u_id'])) {
$addUserRes = UserModel::addUser($addUser);
}
// 生成token 返回小程序
$token = md5($addUser['openid']);
// 将token 存入session 用于后期用户其他操作在请求时辨别用户
session($token,$addUser);
//返回三要素
return json(['code'=>200,'msg'=>'登录成功','data'=>$token]);
}
封装的小程序请求
<?php
// 应用公共文件
/**
* 封装的小程序请求
* @param [type] $data
* @return void
* @author gj
* @date 2021-06-01
*/
function getWx($data)
{
$APPID = "你的小程序APPID ";
$SECRET = "你的SECRET ";
// 拼接url
//code码 在我传过来的data数组中
$url = "https://api.weixin.qq.com/sns/jscode2session?appid={$APPID}&secret={$SECRET}&js_code={$data['code']}&grant_type=authorization_code";
// curl模拟get请求 请求微信请求 以获取openid 和session_key
$curl = curl_init(); // 启动一个CURL会话
curl_setopt($curl, CURLOPT_URL, $url);
curl_setopt($curl, CURLOPT_HEADER, 0);
curl_setopt($curl, CURLOPT_RETURNTRANSFER, 1);
curl_setopt($curl, CURLOPT_SSL_VERIFYPEER, false); // 跳过证书检查
curl_setopt($curl, CURLOPT_SSL_VERIFYHOST, false); // 从证书中检查SSL加密算法是否存在
$tmpInfo = curl_exec($curl); //返回api的json对象
//关闭URL请求
curl_close($curl);
$result = json_decode($tmpInfo, true);
return $result;
}