uniapp微信小程序使用微信身份登录或微信获取手机号码自动登录

最近有需求uniapp的微信小程序要加一个微信登录,所以研究了一下,在开发的时候发现,getUserProfile只能通过tap事件触发登录,所以不能加在open-type=“getPhoneNumber” @getphonenumber="getPhoneNumber"这种事件上面。所以我们只能在登录页面放两个按钮。

一、web代码

html

<button v-if="isMpWweixin" class="wpweixinBtn" hover-class="navigator-hover" @tap="wechatLogin">快捷登录</button>
<button v-if="isMpWweixin" class="wpweixinBtn" hover-class="navigator-hover" open-type="getPhoneNumber" @getphonenumber="getPhoneNumber">手机号码快捷登录</button>			

uniapp的vue2

export default {
   
   
	methods: {
   
   
		//微信小程序快捷登录
			wechatLogin(){
   
   
				uni.showLoading({
   
   
					title: "登录中",
				});
				uni.getUserProfile({
   
   "desc":"develop"}).then(res => {
   
   
					uni.login().then(r => {
   
   
						res[1].userInfo.code = r[1].code // 数据节点
						var userInfo = res[1].userInfo;					
						return this.logining(userInfo);
					}).catch(err=>{
   
   
						uni.showToast({
   
   icon:"none",duration:1500,title:err.errMsg})
					}).finally(r=>{
   
   
						uni.hideLoading();
					})					
				}).catch(e => {
   
   
					console.error(e)
				});		
			},
			/**
			 * 微信小程序登录中,以及之后的跳转 
			*/
			logining(userInfo){
   
   
				this.api.post("user/wechat_auth", userInfo).then((res) => {
   
   
					uni.setStorageSync("access_token", encodeURIComponent(JSON.stringify(res.data.user_id + ' ' + res.data.token)));
					// 登录完成
					// 之后是业务代码,博主也看不懂,不要喷博主
					this.getUserInfo().then(() => {
   
   
						let service_id = this.$store.state.doctorid.service_id;
						let jishi_id = this.$store.state.doctorid.jishi_id;
						let type = this.$store.state.doctorid.type;
						setTimeout(() => {
   
   
							if (type == 6) {
   
   
								uni.reLaunch({
   
   
									url: '/pages/serverDetail/serverDetail?service_id=' +
										service_id + "&jishi_id=" + jishi_id +
										"&type=" + type
								})
							} else {
   
   
								let url = "/pages/index/index"
								this.goTab(url);
							}
						}, 500);
					});
				})
			},
			getPhoneNumber(e){
   
   
				if(e.detail.errMsg == 'getPhoneNumber:fail user deny'){
   
   
					return 
				}else if(e.detail.errMsg == 'getPhoneNumber:ok'){
   
   
					this.mobileCode = e.detail.code
				}else{
   
   
					return
				}
				
				//开始登录
				uni.showLoading({
   
   
					title: "登录中",
				});
				uni.login().then(r => {
   
   
					var userInfo = {
   
   
						'code':r[1].code, // 数据节点
						'mobileCode':this.mobileCode // 请求手机号的code
					}
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值