1、你的测试机一定要有sim卡且打开数据流量
2、在dcloud开发者中心申请权限
https://dev.dcloud.net.cn/pages/common/login?uniIdRedirectUrl=%252Fpages%252Fapp%252Flist
别忘记充值!!!
3、创建阿里云服务空间
4、关联云服务空间(要用登陆dcloud账号的邮箱登陆hbuilderx才能获取到)
5、新增一个getPhoneNumber文件(这个param.json的文件可以不用管)
6、index.js的代码,可以一键复制哟
'use strict';
exports.main = async (event,context) => {
try{
//event为客户端上传的参数
console.log('event : ', event)
const res = await uniCloud.getPhoneNumber({
appid:'__UNI__6666666',// 填你自己的就ok了
provider:'univerify',
access_token:event.access_token,
openid: event.openid
})
console.log('云函数res',res)
//返回数据给客户端
return {
code:0,
message:'获取手机号成功',
data:res
}
}catch(e){
console.log('云函数手机号获取失败e',e)
}
};
这里有个坑!!!
不要再填入Apikey和Api秘钥了,人家都不提供了,肯定找不到
7、package.json
{
"name": "univerify",
"dependencies": [],
"extensions": {
"uni-cloud-verify": {}
},
"cloudfunction-config": {
"memorySize": 512,
"timeout": 5,
"triggers": [],
"path": "/getPhoneNumber",
"runtime": "Nodejs8"
}
}
8、在需要一键登录的地方填
uni.getProvider({
service: 'oauth',
success: function (res) {
console.log(res.provider) // ['qq', 'univerify']
uni.preLogin({
provider: 'univerify',
success() { //预登录成功
// 显示一键登录选项
uni.login({
provider: 'univerify',
univerifyStyle: { // 自定义登录框样式
//参考`univerifyStyle 数据结构`
"fullScreen": true, // 是否全屏显示,默认值: false
"backgroundColor": "#ffffff", // 授权页面背景颜色,默认值:#ffffff
"backgroundImage": "", // 全屏显示的背景图片,默认值:"" (仅支持本地图片,只有全屏显示时支持)
"icon": {
"path": "static/xxx.png", // 自定义显示在授权框中的logo,仅支持本地图片 默认显示App logo
"width": "60px", //图标宽度 默认值:60px
"height": "60px" //图标高度 默认值:60px
},
"closeIcon": {
"path": "static/xxx.png", // 自定义显示在授权框中的logo,仅支持本地图片 默认显示App logo
"width": "60px", //图标宽度 默认值:60px (HBuilderX 4.0支持)
"height": "60px" //图标高度 默认值:60px (HBuilderX 4.0支持)
},
"phoneNum": {
"color": "#202020" // 手机号文字颜色 默认值:#202020
},
"slogan": {
"color": "#BBBBBB" // slogan 字体颜色 默认值:#BBBBBB
},
"authButton": {
"normalColor": "#12B858", // 授权按钮正常状态背景颜色 默认值:#3479f5
"highlightColor": "##12B858", // 授权按钮按下状态背景颜色 默认值:#2861c5(仅ios支持)
"disabledColor": "#666666", // 授权按钮不可点击时背景颜色 默认值:#73aaf5(仅ios支持)
"textColor": "#ffffff", // 授权按钮文字颜色 默认值:#ffffff
"title": "本机号码一键登录", // 授权按钮文案 默认值:“本机号码一键登录”
"borderRadius": "10px" // 授权按钮圆角 默认值:"24px" (按钮高度的一半)
},
"otherLoginButton": {
"visible": true, // 是否显示其他登录按钮,默认值:true
"normalColor": "", // 其他登录按钮正常状态背景颜色 默认值:透明
"highlightColor": "", // 其他登录按钮按下状态背景颜色 默认值:透明
"textColor": "#656565", // 其他登录按钮文字颜色 默认值:#656565
"title": "其他登录方式", // 其他登录方式按钮文字 默认值:“其他登录方式”
"borderColor": "", //边框颜色 默认值:透明(仅iOS支持)
"borderRadius": "0px" // 其他登录按钮圆角 默认值:"24px" (按钮高度的一半)
},
"privacyTerms": {
"defaultCheckBoxState": true, // 条款勾选框初始状态 默认值: true
"isCenterHint": false, //未勾选服务条款时点击登录按钮的提示是否居中显示 默认值: false (3.7.13+ 版本支持)
"uncheckedImage": "", // 可选 条款勾选框未选中状态图片(仅支持本地图片 建议尺寸 24x24px)(3.2.0+ 版本支持)
"checkedImage": "", // 可选 条款勾选框选中状态图片(仅支持本地图片 建议尺寸24x24px)(3.2.0+ 版本支持)
"checkBoxSize": 12, // 可选 条款勾选框大小
"textColor": "#BBBBBB", // 文字颜色 默认值:#BBBBBB
"termsColor": "#5496E3", // 协议文字颜色 默认值: #5496E3
"prefix": "我已阅读并同意", // 条款前的文案 默认值:“我已阅读并同意”
"suffix": "并使用本机号码登录", // 条款后的文案 默认值:“并使用本机号码登录”
"privacyItems": [ // 自定义协议条款,最大支持2个,需要同时设置url和title. 否则不生效
{
"url": "https://", // 点击跳转的协议详情页面
"title": "用户服务协议" // 协议名称
}
]
},
"buttons": { // 自定义页面下方按钮仅全屏模式生效(3.1.14+ 版本支持)
"iconWidth": "45px", // 图标宽度(高度等比例缩放) 默认值:45px
"list": [{
"provider": "apple",
"iconPath": "/static/apple.png" // 图标路径仅支持本地图片
},
{
"provider": "weixin",
"iconPath": "/static/wechat.png" // 图标路径仅支持本地图片
}
]
}
},
success(res) {
//通过返回的openid和access_token作为云函数的event的参数,换取手机号
let {
openid,
access_token
} = res.authResult
console.log(res.authResult);
//调用云函数,换取手机号
//调用云函数的方法
uniCloud.callFunction({
name: "getPhoneNumber", //云函数的名字
// 传递给云函数的参数event
data: {
openid,
access_token,
},
})
// 调用云函数成功,支持then,catch
.then(async res => {
// 登录成功
// showToast('登录成功')
//成功条件下,获取用户的手机号
let phoneNumber = res.result.data
.phoneNumber;
// 调用公司的开发服务器,才能完成登录
console.log('获取到的手机号', phoneNumber);
//这里调你自己公司写的接口,完成剩下的登录操作
})
// 调用云函数失败
.catch(err => {
console.log("云函数调用失败", err)
// 跳转到其他的登录方式
// showToast('登录失败')
})
},
fail(res) { // 登录失败
console.log(res.errCode)
if (res.errCode == 30002) {
uni.closeAuthView()
}
console.log(res.errMsg)
}
})
},
fail(res) { // 预登录失败
// 不显示一键登录选项(或置灰)
// 根据错误信息判断失败原因,如有需要可将错误提交给统计服务器
// showToast('请检查SIM卡状态')
console.log(res.errCode)
console.log(res.errMsg)
}
})
}
});
完成了完成了!!!