uniapp一键登录
一、整理思路
un-app官网提供多种实现一键登录的方法,这里的选择是 自有服务器调用
二、uni-app准备账号
1、un-app官网注册账号,并在dcloud开发者中心创建应用
2、开通一键登录服务 保管好 ApiKey 和 ApiSecret
3、点击右下角的添加应用并提交申请
4、添加服务空间
三、uni-app开通一键登录
1、uni-app项目开通uniCloud服务
关联云空间选择阿里云或腾讯云均可
2、新建云函数
3、新建云函数后会有一个index.js生成,粘贴以下代码
'use strict';
const crypto = require('crypto')
exports.main = async (event, context) => {
//event为客户端上传的参数
console.log('event : ', event);
console.log('参数', event.queryStringParameters);
// event里包含着客户端提交的参数
const res = await uniCloud.getPhoneNumber({
appid: '###', // 替换成自己开通一键登录的应用的DCloud appid,使用callFunction方式调用时可以不传(会自动取当前客户端的appid),如果使用云函数URL化的方式访问必须传此参数
provider: 'univerify',
apiKey: '###, // 在开发者中心开通服务并获取apiKey
apiSecret: '###', // 在开发者中心开通服务并获取apiSecret
access_token: event.queryStringParameters.access_token,
openid: event.queryStringParameters.openid
})
console.log('res',res); // res里包含手机号
// 执行用户信息入库等操作,正常情况下不要把完整手机号返回给前端
// 如果数据库在uniCloud上,可以直接入库
// 如果数据库不在uniCloud上,可以通过 uniCloud.httpclient API,将手机号通过http方式传递给其他服务器的接口,详见:https://uniapp.dcloud.net.cn/uniCloud/cf-functions?id=httpclient
return {
code: 0,
message: '获取手机号成功',
data:res
}
};
4、保存后上传部署到云空间
5、勾选一键登录(项目中的 manifest.json)
四、项目编码
1、调取一键登录
官方有示例代码 查看
uni.login({
provider: 'univerify',
success(res) { // 登录成功
console.log(res.authResult); // {openid:'登录授权唯一标识',access_token:'接口返回的 token'}
res.authResult.accessToken = res.authResult.access_token
return that.$request({
method: 'POST',
url: '后台做具体逻辑的接口',
data: res.authResult
}).then(res => {
uni.closeAuthView() //成功关闭授权页面
console.log('登录成功', res)
if (res.code) return
that.$store.commit('setToken', res.data)
that.$util.msg('登录成功')
setTimeout(() => {
uni.redirectTo({
url: '登陆成功跳转的目标页面'
})
}, 500)
})
},
fail(res) { // 登录失败
console.log(res.errCode)
console.log(res.errMsg)
}
})
2、日志可以再云函数列表查看
云函数可在云函数列表查看
3、云函数url化
在云函数列表点击详情,下拉到底部点击编辑设置一个url
4、后台写具体逻辑
5、需要的工具类
1、HeaUtil.java
public class HeaUtil {
/**
* sha256_HMAC加密
*
* @param message 消息
* @param secret 秘钥
* @return 加密后字符串
*/
public static String sha256_HMAC(String message, String secret) {
String hash = "";
try {
Mac sha256_HMAC = Mac.getInstance("HmacSHA256");
SecretKeySpec secret_key = new SecretKeySpec(secret.getBytes(), "HmacSHA256");
sha256_HMAC.init(secret_key);
byte[] bytes = sha256_HMAC.doFinal(message.getBytes());
hash = byteArrayToHexString(bytes);
} catch (Exception e) {
System.out.println("Error HmacSHA256 ===========" + e.getMessage());
}
return hash;
}
/**
* 将加密后的字节数组转换成字符串
*
* @param b 字节数组
* @return 字符串
*/
private static String byteArrayToHexString(byte[] b) {
StringBuilder hs = new StringBuilder();
String stmp;
for (int n = 0; b != null && n < b.length; n++) {
stmp = Integer.toHexString(b[n] & 0XFF);
if (stmp.length() == 1)
hs.append('0');
hs.append(stmp);
}
return hs.toString().toLowerCase();
}
}
迷途者寻影而行
【推荐】国内首个AI IDE,深度理解中文开发场景,立即下载体验Trae
【推荐】编程新体验,更懂你的AI,立即体验豆包MarsCode编程助手
【推荐】抖音旗下AI助手豆包,你的智能百科全书,全免费不限次数
【推荐】轻量又高性能的 SSH 工具 IShell:AI 加持,快人一步
· 记一次.NET内存居高不下排查解决与启示
· 探究高空视频全景AR技术的实现原理
· 理解Rust引用及其生命周期标识(上)
· 浏览器原生「磁吸」效果!Anchor Positioning 锚点定位神器解析
· 没有源码,如何修改代码逻辑?
· 全程不用写代码,我用AI程序员写了一个飞机大战
· MongoDB 8.0这个新功能碉堡了,比商业数据库还牛
· 记一次.NET内存居高不下排查解决与启示
· DeepSeek 开源周回顾「GitHub 热点速览」
· 白话解读 Dapr 1.15:你的「微服务管家」又秀新绝活了