uniapp手机号一键登录

先讲几个坑避免操作完以后会出bug无效喷我

1. 部分机型会因为第一次在手机上编译普通基座无法触发手机号一键登录的弹框，这里当然是重启了，重启可以解决百分之八十的问题！！！
2. 然后就是细心程度的问题的：开通uniapp云空间一键登录的包名要和后台设置的，本地打包的包名，千万千万要一致，本人就是因为包名的问题硬生生的被卡住了三天，总之一句话，项目内所有要用到的包名都要和服务空间的包名一致，切记！！！
3. 当你的一键登录逻辑编写完之后就要运行到手机上看效果了，此时记住，部分机型会导致自定义基座无效，这时不要慌张，官网讲的很清楚，有的手机打自定义基座包无效，只要换成正式打包的就可以了
4. 手机一定一定一定要有手机卡，移动网络要打开，不然无效，砸电脑也没有用
   接下来看代码（保姆式教程还望兄弟们仔细看）

登陆你的云开发空间找到一键登录注意红框圈起来的地方都是重要的，这个申请流程官网都有，这里就不叙述了

本地新建的项目右键选择红框的选项，阿里、腾讯看自己的需求创建
右键uniCloud

关联服务空间，就是你自己创建的服务空间

然后在红框下新建文件loginByUniverify然后新建index.js文件

然后就是广大程序员最喜欢的过程ctrl+c

'use strict';

const db = uniCloud.database()

exports.main = async (event, context) => {
	const res = await uniCloud.getPhoneNumber({
		appid: '', // 替换成uniapp的__UNI__的id
		provider: 'univerify',
		apiKey: '', // 服务空间的key
		apiSecret: '', // 服务空间的apiSecret
		access_token: event.access_token,
		openid: event.openid
	});

	console.log(res); // res里的数据格式	{ code: 0, success: true, phoneNumber: '手机号' }
	return await db.collection('regUser').add({		
		openid: event.openid, 
		PhoneNumber:res.phoneNumber,
		createTime: Date.now()		
	})
};
这里的代码复制就可以了，不要改也不用懂

复制进刚才新建的index文件中

然后就可以写一个小小的dome了

<template>
	<view>
			<view @click="submitlogin()">
				一键登陆
			</view>
	</view>
</template>

<script>
	export default {
		data() {
			return {}
		},
		onLoad() {
			this.isAutoLogin()
		},
		methods: {
			// 判断是否支持一键登陆
			isAutoLogin() {
				let _that = this
				uni.getProvider({ //获取可用的服务提供商
					service: 'oauth',
					success: function(res) {
						console.log(res.provider) // ['weixin', qq', 'univerify']
					}
				});
				uni.preLogin({ //预登录
					provider: 'univerify', //用手机号登录
					success() {
						_that.autoStatus = true
						console.log('预登录成功')
					},

					fail(err) { //预登录失败
						_that.autoStatus = false
						console.log('错误码：' + err.errCode)
						console.log(err.errMsg)
					}
				})
			},
			submitlogin() {
				uni.login({ //正式登录，弹出授权窗
					provider: 'univerify',
					univerifyStyle: { // 自定义登录框样式
						"fullScreen": true, // 是否全屏显示，true表示全屏模式，false表示非全屏模式，默认值为false。
						"backgroundColor": "#ffffff", // 授权页面背景颜色，默认值：#ffffff 
						"phoneNum": {
							"color": "#2281F5", // 手机号文字颜色 默认值：#000000   
						},
						"authButton": {
							"normalColor": "#3479f5", // 授权按钮正常状态背景颜色 默认值：#3479f5  
							"highlightColor": "#2861c5", // 授权按钮按下状态背景颜色 默认值：#2861c5（仅ios支持）  
							"disabledColor": "#73aaf5", // 授权按钮不可点击时背景颜色 默认值：#73aaf5（仅ios支持）  
							"textColor": "#ffffff", // 授权按钮文字颜色 默认值：#ffffff  
							"title": "本机号码一键登录" // 授权按钮文案 默认值：“本机号码一键登录”  
						}
					},
					success(res) { // 正式登录成功
						console.log(res.authResult); // {openid:'登录授权唯一标识',access_token:'接口返回的 token'}

						// 在得到access_token后，通过callfunction调用云函数
						uniCloud.callFunction({
							name: 'loginByUniverify', // 云函数名称
							data: { //传给云函数的参数
								'access_token': res.authResult.access_token, // 客户端一键登录接口返回的access_token
								'openid': res.authResult.openid // 客户端一键登录接口返回的openid
							},
							success(callRes) {
								console.log('调用云函数成功' + callRes)
							},
							fail(callErr) {
								console.log('调用云函数出错' + callErr)
							},
							complete() {
								uni.closeAuthView() //关闭授权登录界面
							}
						})
					},
					fail(err) { // 正式登录失败
						console.log(err.errCode)
						console.log(err.errMsg)
						uni.closeAuthView() //关闭授权登录界面
					}
				})
			}
		}
	}
</script>

然后根据自己的代码需求修改代码就可以了，到这里，你的项目是可以调起手机号一键登陆的
然后就可以在手机上调试你的项目了，防止意外不要打自定义基座包，确定代码无误之后上传云函数
并选择连接云端云函数，恭喜你成功了

防止中途出现意外，查看你的云空间调用记录，成功了会有记录并且扣费0.02这笔巨款

如果您觉得有帮助，点个赞感谢！！！