uni-app手机号一键登录

提示:手机号一键登录有两种方式。
第一种通过调用自有服务器,然后服务器调用云函数登录。
第二种可以前端直接调用云函数进行登录(暂不介绍)。
提示:在我的项目中使用的是自由服务器登录,下面的案例可供参考


一、自有服务器等录

1.uni-app开通账号权限

使用开发者账号登录开发者中心,在左侧导航选择“一键登录”。在使用此功能前需要先完成邮箱及手机号验证,根据开发者中心页面提示完成验证即可。验证后,点击页面上的“同意协议并开通”,便可开通账号一键登录服务。(该功能收费:成功请求0.02元,失败不计费)
到添加应用时注意生成SHA256加密的签名时一定要使用1.8的jdk!!!!
具体流程:https://ask.dcloud.net.cn/article/37965

2.部署云函数

在项目中创建云函数,选择一个云环境。
创建云函数
然后创建函数,我这里用的是腾讯云。
云函数结构
在index.js中写下以下代码。服务器端代码可以参考:https://blog.csdn.net/kevlin_V/article/details/112789828

// 云函数验证签名,此示例中以接受GET请求为例作演示
const crypto = require('crypto')
module.exports = async(event){

  const secret = 'your-secret-string' // 自己的密钥不要直接使用示例值,且注意不要泄露
  const hmac = crypto.createHmac('sha256', secret);

  let params = event.queryStringParameters
  const sign = params.sign
  delete params.sign
  const signStr = Object.keys(params).sort().map(key => {
    return `${key}=${params[key]}`
  }).join('&')

  hmac.update(signStr);
  
//hmac.digest('hex')调用第一次有结果,随后的都为空,如果想console.log看的这个后面再用一定会报错的。
  if(sign!==hmac.digest('hex')){
    throw new Error('非法访问')
  }

  const {
    access_token,
    openid
  } = params
  const res = await uniCloud.getPhoneNumber({
      provider: 'univerify',
    appid: 'xxx', // DCloud appid,不同于callFunction方式调用,使用云函数Url化需要传递DCloud appid参数
      apiKey: 'xxx', // 在开发者中心开通服务并获取apiKey
      apiSecret: 'xxx', // 在开发者中心开通服务并获取apiSecret
      access_token: access_token,
      openid: openid
  })
  // 返回手机号给自己服务器
  return res
}

3.APP端代码

tellogin(){
				uni.preLogin({
					provider: 'univerify',
					success:()=>{
						uni.login({
							provider: 'univerify',
							univerifyStyle: { // 自定义登录框样式
							},
							success:(res)=>{ // 登录成功
								let loginRes = res.authResult
							// loginRes : {openid:'deviceIDlength+deviceID+gyuid',access_token:'接口返回的 token'}
							// 自己的后台登录请求逻辑
							// 配合后台伙伴请求DCloud云函数来获取手机号码
							},
							fail(res){  // 登录失败
								uni.closeAuthView()//关闭一键登录弹出窗口
							},
							complete: () => {
								uni.closeAuthView()
							}
						})
					},
					fail(res){  
						// 预登录失败
						//如果手机没有插入有效的sim卡,或者手机蜂窝数据网络关闭,
						//都有可能造成预登录校验失败。
					}
				})
			},
  • 8
    点赞
  • 33
    收藏
    觉得还不错? 一键收藏
  • 打赏
    打赏
  • 4
    评论

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 4
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包

打赏作者

静的小白菜

你的鼓励将是我创作的最大动力

¥1 ¥2 ¥4 ¥6 ¥10 ¥20
扫码支付:¥1
获取中
扫码支付

您的余额不足,请更换扫码支付或充值

打赏作者

实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值