用户绑定微信号

This commit is contained in:
2025-06-05 18:09:08 +08:00
parent e1e51c8c6f
commit 8072e65a69
6 changed files with 479 additions and 188 deletions
+76 -33
View File
@@ -11,6 +11,9 @@ use PHPMailer\PHPMailer\PHPMailer;
use think\Response;
use app\index\model\UserMessage;
use app\index\model\SystemNotice;
use Endroid\QrCode\QrCode;
use Endroid\QrCode\Writer\PngWriter;
class UserController extends BaseController
{
@@ -217,43 +220,43 @@ class UserController extends BaseController
}
// 微信授权回调
public function wechatCallback()
{
$code = $this->request->get('code');
if (!$code) {
return json(['code' => 0, 'msg' => '微信授权失败']);
}
// public function wechatCallback()
// {
// $code = $this->request->get('code');
// if (!$code) {
// return json(['code' => 0, 'msg' => '微信授权失败']);
// }
try {
// 这里应该调用微信API获取用户信息
// 示例代码,实际使用时需要替换为真实的微信API调用逻辑
// $wechatUser = getWechatUserInfo($code);
// try {
// // 这里应该调用微信API获取用户信息
// // 示例代码,实际使用时需要替换为真实的微信API调用逻辑
// // $wechatUser = getWechatUserInfo($code);
// 模拟获取到的微信用户信息
$wechatUser = [
'openid' => 'test_openid_' . time(),
'nickname' => '微信用户',
'avatar' => ''
];
// // 模拟获取到的微信用户信息
// $wechatUser = [
// 'openid' => 'test_openid_' . time(),
// 'nickname' => '微信用户',
// 'avatar' => ''
// ];
// 检查用户是否已注册
$user = Users::where('openid', $wechatUser['openid'])->find();
if ($user) {
// 已注册,直接登录
session('user_id', $user->id);
return json(['code' => 1, 'msg' => '登录成功']);
}
// // 检查用户是否已注册
// $user = Users::where('openid', $wechatUser['openid'])->find();
// if ($user) {
// // 已注册,直接登录
// session('user_id', $user->id);
// return json(['code' => 1, 'msg' => '登录成功']);
// }
// 未注册,返回注册所需信息
return json([
'code' => 2,
'msg' => '需要注册',
'data' => $wechatUser
]);
} catch (\Exception $e) {
return json(['code' => 0, 'msg' => '微信授权失败:' . $e->getMessage()]);
}
}
// // 未注册,返回注册所需信息
// return json([
// 'code' => 2,
// 'msg' => '需要注册',
// 'data' => $wechatUser
// ]);
// } catch (\Exception $e) {
// return json(['code' => 0, 'msg' => '微信授权失败:' . $e->getMessage()]);
// }
// }
// 发送邮箱验证码
public function sendEmailCode()
@@ -356,6 +359,7 @@ class UserController extends BaseController
$user->phone = $data['phone'] ?? '';
$user->sex = $data['sex'] ?? 0;
$user->qq = $data['qq'] ?? '';
$user->wechat = $data['wechat'] ?? '';
$user->update_time = time();
if ($user->save()) {
@@ -691,4 +695,43 @@ class UserController extends BaseController
}
}
}
//生成二维码绑定微信
public function qrcode()
{
// 检查用户是否登录
if (!cookie('user_account')) {
return json(['code'=> -1,'msg'=> '请先登录']);
}
// 获取当前用户信息
$user = Users::where('account', cookie('user_account'))->find();
if (!$user) {
return json(['code' => -1, 'msg' => '用户信息获取失败']);
}
// 假设这里生成一个唯一的绑定标识,例如使用用户ID和时间戳组合
$bindToken = md5($user->id . time());
// 生成实际的绑定 URL
$domain = $this->request->domain();
$bindUrl = "{$domain}/wechat_bind?token={$bindToken}";
// 将绑定标识存入缓存,设置有效期,例如30分钟
cache('wechat_bind_token_' . $user->id, $bindToken, 1800);
try {
// 创建二维码实例
$qrCode = QrCode::create($bindUrl);
$writer = new PngWriter();
// 生成二维码图片
$result = $writer->write($qrCode);
$qrCodeDataUri = $result->getDataUri();
return json(['code' => 0, 'msg' => '二维码生成成功', 'data' => ['qrcode_url' => $qrCodeDataUri]]);
} catch (\Exception $e) {
return json(['code' => -1, 'msg' => '二维码生成失败: ' . $e->getMessage()]);
}
}
}
+17
View File
@@ -0,0 +1,17 @@
<?php
namespace app\index\model;
use think\Model;
class LoginVerification extends Model
{
protected $autoWriteTimestamp = 'datetime';
protected $createTime = 'created_at';
protected $updateTime = 'updated_at';
public function getExpiredAtAttribute($value)
{
return strtotime($value);
}
}
+189 -148
View File
@@ -10,7 +10,8 @@
<div class="layui-form-item">
<label class="layui-form-label">用户名</label>
<div class="layui-input-block">
<input type="text" name="name" value="{$user.name}" placeholder="请输入用户名" class="layui-input">
<input type="text" name="name" value="{$user.name}" placeholder="请输入用户名"
class="layui-input">
</div>
</div>
@@ -24,14 +25,27 @@
<div class="layui-form-item">
<label class="layui-form-label">QQ</label>
<div class="layui-input-block">
<input type="qq" name="qq" value="{$user.qq}" placeholder="请输入QQ号" class="layui-input">
<input type="text" name="qq" value="{$user.qq}" placeholder="请输入QQ号" class="layui-input">
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">微信</label>
<div class="layui-input-block">
{if $user.wechat}
<input type="text" name="wechat" value="{$user.wechat}" placeholder="请输入微信号"
class="layui-input">
{else}
<button class="layui-btn" id="bindWechat">绑定微信号</button>
{/if}
</div>
</div>
<div class="layui-form-item">
<label class="layui-form-label">手机号</label>
<div class="layui-input-block">
<input type="tel" name="phone" value="{$user.phone}" placeholder="请输入手机号" class="layui-input">
<input type="text" name="phone" value="{$user.phone}" placeholder="请输入手机号"
class="layui-input">
</div>
</div>
@@ -84,150 +98,6 @@
</div>
</div>
<style>
.basic-info {
max-width: 800px;
margin: 0 auto;
}
.section-title {
font-size: 20px;
font-weight: 600;
color: #333;
margin-bottom: 24px;
padding-bottom: 16px;
border-bottom: 1px solid #f0f0f0;
}
.layui-form-label {
width: 100px;
}
.layui-input-block {
margin-left: 130px;
}
.layui-form-item {
margin-bottom: 24px;
}
.layui-textarea {
min-height: 120px;
}
.avatar-section {
max-width: 800px;
margin: 0 auto;
}
.avatar-upload-container {
display: flex;
gap: 40px;
margin-bottom: 32px;
}
.current-avatar {
text-align: center;
}
.current-avatar img {
width: 160px;
height: 160px;
border-radius: 50%;
object-fit: cover;
border: 3px solid #f5f5f5;
}
.avatar-tip {
margin-top: 12px;
color: #666;
}
.upload-area {
flex: 1;
border: 2px dashed #d9d9d9;
border-radius: 8px;
padding: 40px;
text-align: center;
cursor: pointer;
transition: all 0.3s;
}
.upload-area:hover {
border-color: #1677ff;
}
.upload-area .layui-icon {
font-size: 48px;
color: #999;
margin-bottom: 16px;
}
.upload-area p {
margin: 8px 0;
color: #666;
}
.upload-tip {
font-size: 12px;
color: #999;
}
.avatar-preview {
margin-top: 32px;
padding-top: 32px;
border-top: 1px solid #f0f0f0;
}
.avatar-preview h3 {
font-size: 16px;
color: #333;
margin-bottom: 16px;
}
.preview-container {
text-align: center;
margin-bottom: 24px;
}
.preview-container img {
max-width: 200px;
max-height: 200px;
border-radius: 8px;
}
.preview-actions {
text-align: center;
}
.preview-actions .layui-btn {
margin: 0 8px;
}
@media (max-width: 768px) {
.layui-form-label {
width: 80px;
}
.layui-input-block {
margin-left: 110px;
}
.avatar-upload-container {
flex-direction: column;
gap: 24px;
}
.current-avatar img {
width: 120px;
height: 120px;
}
.upload-area {
padding: 24px;
}
}
</style>
<script>
layui.use(['form', 'layer', 'upload'], function () {
@@ -235,6 +105,31 @@
var layer = layui.layer;
var upload = layui.upload;
// 绑定微信号按钮点击事件
document.getElementById('bindWechat').addEventListener('click', function () {
// 发送 AJAX 请求调用 qrcode 接口
fetch('/index/user/qrcode')
.then(response => response.json())
.then(data => {
if (data.code === 0) {
// 二维码生成成功,这里可以添加显示二维码的逻辑,例如弹出一个窗口显示二维码
layer.open({
type: 1,
title: '微信绑定二维码',
content: `<img src="${data.data.qrcode_url}" alt="微信绑定二维码">`,
area: ['300px', '300px']
});
} else {
// 二维码生成失败,提示用户
layer.msg(data.msg, { icon: 2 });
}
})
.catch(error => {
// 请求出错,提示用户
layer.msg('请求出错,请稍后重试', { icon: 2 });
});
});
// 监听个人资料表单提交
form.on('submit(saveBasic)', function (data) {
// 发送AJAX请求保存数据
@@ -382,4 +277,150 @@
document.getElementById('avatarFile').dispatchEvent(event);
});
});
</script>
</script>
<style>
.basic-info {
max-width: 800px;
margin: 0 auto;
}
.section-title {
font-size: 20px;
font-weight: 600;
color: #333;
margin-bottom: 24px;
padding-bottom: 16px;
border-bottom: 1px solid #f0f0f0;
}
.layui-form-label {
width: 100px;
}
.layui-input-block {
margin-left: 130px;
}
.layui-form-item {
margin-bottom: 24px;
}
.layui-textarea {
min-height: 120px;
}
.avatar-section {
max-width: 800px;
margin: 0 auto;
}
.avatar-upload-container {
display: flex;
gap: 40px;
margin-bottom: 32px;
}
.current-avatar {
text-align: center;
}
.current-avatar img {
width: 160px;
height: 160px;
border-radius: 50%;
object-fit: cover;
border: 3px solid #f5f5f5;
}
.avatar-tip {
margin-top: 12px;
color: #666;
}
.upload-area {
flex: 1;
border: 2px dashed #d9d9d9;
border-radius: 8px;
padding: 40px;
text-align: center;
cursor: pointer;
transition: all 0.3s;
}
.upload-area:hover {
border-color: #1677ff;
}
.upload-area .layui-icon {
font-size: 48px;
color: #999;
margin-bottom: 16px;
}
.upload-area p {
margin: 8px 0;
color: #666;
}
.upload-tip {
font-size: 12px;
color: #999;
}
.avatar-preview {
margin-top: 32px;
padding-top: 32px;
border-top: 1px solid #f0f0f0;
}
.avatar-preview h3 {
font-size: 16px;
color: #333;
margin-bottom: 16px;
}
.preview-container {
text-align: center;
margin-bottom: 24px;
}
.preview-container img {
max-width: 200px;
max-height: 200px;
border-radius: 8px;
}
.preview-actions {
text-align: center;
}
.preview-actions .layui-btn {
margin: 0 8px;
}
@media (max-width: 768px) {
.layui-form-label {
width: 80px;
}
.layui-input-block {
margin-left: 110px;
}
.avatar-upload-container {
flex-direction: column;
gap: 24px;
}
.current-avatar img {
width: 120px;
height: 120px;
}
.upload-area {
padding: 24px;
}
}
</style>