<template>
</template>
<script setup>
import { ref,onMounted } from 'vue'
import { showToast } from 'vant'
import { uni_login } from '@/api/login'
import { useCounterStore } from '@/stores/counter.js'
import { useRouter } from 'vue-router'
import vConsole from 'vconsole'
new vConsole()
// uni-app一键登录相关变量
const auth = ref(null);
const oneClickLoginVisible = ref(false);
const oaid = ref('')
const store = useCounterStore()
const router = useRouter()
// 判断是否为移动端设备
onMounted(()=>{
// 首先检查是否在移动环境中
if (!window.plus) {
console.log('非移动环境,不初始化一键登录');
return;
}
// if(parseFloat(plus.runtime.version)<3.0){
// console.log('版本过低,不初始化一键登录');
// return;
// }
//alert('init')
init();
})
// 初始化uni-app一键登录服务
const init = () => {
oneClickLoginVisible.value = false;
plus.oauth.getServices(function(services) {
console.log('获取到的授权服务:', services);
for (var i in services) {
var service = services[i];
if (service.id == "univerify") {
auth.value = service;
window.auth=service
service.preLogin(function(event) {
// 预登录成功,直接触发一键登录
console.log(event)
console.log('预登录成功,自动触发一键登录');
oneClickLoginVisible.value = true;
alert('prelogin success')
//performUniOneClickLogin(service);
}, function(error) {
// 预登录失败
console.error('一键登录预登录失败:', error.message);
oneClickLoginVisible.value = false;
});
break;
}
}
if (!auth.value) {
console.log('未找到univerify服务,无法使用一键登录');
}
}, function(error) {
console.error('获取授权服务失败:', error);
});
};
function login_sec(result){
//没有执行到这里
alert('login success')
const openid = result.target.authResult.openid;
const access_token = result.target.authResult.access_token;
if("一键登录"!=auth.value.description){
console.log('不是一键登录');
return
}
// 调用后端接口验证登录结果
uni_login(openid, access_token,oaid.value).then(response => {
console.log("unilogin res",response.data);
if (response.data.url) {
window.location.href = response.data.url;
} else {
showToast('登录验证失败,请使用其他登录方式');
}
}).catch(error => {
console.error('一键登录验证失败:', error);
//alert('login error')
showToast('登录验证失败,请使用其他登录方式');
}).finally(() => {
console.log('一键登录流程结束');
auth.value.closeAuthView();
});
}
function login_err(error){
alert('login error')
console.error('一键登录失败:', error);
const url=window.location.pathname
console.log('当前URL:', url);
//alert(error.code)
//30003 是关闭页面
//30002是切换登录
// 处理用户取消操作
window.ignore_resume=false
if (error.code === 30003) {
window.ignore_resume=true
}
else if (error.code === 30006) {
console.log('error.message===',error.message);
window.ignore_resume=true
}
else if (error.code === 30002) {
window.ignore_resume=true
if(url.indexOf('/login')>-1){
console.log('当前登录页面');
}
else if(url.indexOf('/home')>-1){
console.log('当前是首页')
router.push({ path: '/login',query:{"noopen":1} });
}
}
// 关闭授权视图
if (auth.value) {
auth.value.closeAuthView();
}
}
// 执行一键登录
const performUniOneClickLogin = () => {
if(!oneClickLoginVisible.value){
//预登陆失败,则不登录
//alert('yudenglu shibai ')
return
}
const style={
// 自定义页面参数
"provider":'univerify',
"univerifyStyle": {
"fullScreen": true,
// icon: {
// path: "/images/logo.png" //不管用
// },
"phoneNum": {
"color": "#333333",
"fontSize": "34px", // 手机号文字颜色 默认值:#202020
},
"slogan": {
"color": "white" , // slogan 字体颜色 默认值:#BBBBBB
"fontSize": "0px"
},
"otherLoginButton": {
"visible": true, // 是否显示其他登录按钮,默认值:true
"normalColor": "", // 其他登录按钮正常状态背景颜色 默认值:透明
"highlightColor": "", // 其他登录按钮按下状态背景颜色 默认值:透明
"textColor": "#656565", // 其他登录按钮文字颜色 默认值:#656565
"title": "其他登录方式", // 其他登录方式按钮文字 默认值:“其他登录方式”
"borderColor": "", //边框颜色 默认值:透明(仅iOS支持)
"borderRadius": "0px" // 其他登录按钮圆角 默认值:"0px"
},
"authButton": {
"normalColor": "#ff7652", // 授权按钮正常状态背景颜色 默认值:#3479f5
"highlightColor": "#FF9900",
"disabledColor": "#73aaf5",
"textColor": "#ffffff", // 授权按钮文字颜色 默认值:#ffffff
"title": "本机号码一键注册/登录", // 授权按钮文案 默认值:“本机号码一键登录”
"borderRadius": "5px" // 授权按钮圆角 默认值:"24px" (按钮高度的一半)
},
"privacyTerms": {
"defaultCheckBoxState": true,
"textColor": '#666666',
"termsColor": '#ff7652',
"prefix": "我已阅读并同意",
"suffix": ",使用本机号码注册和登录",
"uncheckedImage":"/images/unchecked.png",
"checkedImage":"/images/checked.png",
"privacyItems": [
{
"url":"https://renyajun-1254809262.cos.ap-beijing.myqcloud.com/app/privacy-policy.html",// 点击跳转的协议详情页面
"title": "用户使用协议" // 协议名称
} ,
{
"url":"https://renyajun-1254809262.cos.ap-beijing.myqcloud.com/app/service-agreement.html",// 点击跳转的协议详情页面
"title": "隐私保护协议" // 协议名称
}
]
},
}
}
alert('可以执行到这里')
auth.value.login(login_sec, login_err, style); //这一行感觉不执行
};
defineExpose({
performUniOneClickLogin,
});
</script>
辛苦看下上面的问题。授权窗口打开了,但是点击一键登录就一直转圈。非常着急,请帮忙解决
2 个回复
DCloud_iOS_WZT
按照bug模版 写清楚
哪个平台 HBuilderX版本 是否是cli项目等
t***@qq.com (作者) - aaa
抱歉,找不到bug模板,不清楚是什么
我是android 用的h5+ plus 云平台打包的
HbuilderX 是4.45
不知道是不是cli项目,没有涉及