uni-app:小程序存在违规收集手机号问题

问题:微信小程序被投诉违规收集手机号问题,相关链接小程序收集用户手机号行为规范
解决思路:手机号授权登录需要加一个二次弹窗,而不是直接获取手机号。
在这里插入图片描述

<template>
  <view class="y-footer y-center">
     <!-- #ifdef MP-WEIXIN -->
     <button size="mini" :plain="true" @click="phoneAcceseHandler">手机号授权登录</button>
   </view>
   <u-modal v-if="show" :show="show" closeOnClickOverlay :showCancelButton="false" :showConfirmButton="false"
	      width="500rpx">
	      <view class="cus-modal-cent">
	        <view class="cus-header">
	          <!-- <u-icon name="error-circle" color="#faad33" size="14"></u-icon> -->
	          <text class="tips-infor">{{ content }}</text>
	        </view>
	        <view class="cus-btn">
	          <u-button class="cancle-car-btn" :plain="true" text="拒绝" @click="close"></u-button>
	          <u-button class="add-car-btn" type="primary" open-type="getPhoneNumber"
	            @getphonenumber="getPhoneNumber">同意</u-button>
	        </view>
	      </view>
	    </u-modal>
	</template>
	<script>
	export default {
	  data() {
	    return {
            getPhoneNumberObj: null,
            parWX: {
		        code: '',
		        iv: '',
		        encryptedData: '',
		        clientId: 'small_program',
		        clientSecret: 'small_program',
		        appVersion: '1',
		        sysVersion: sysInfo.system,
		        grantType: 'small_program',
		      }
		    }
		  },
	  methods: {
	  // 二次确认弹窗
	   phoneAcceseHandler() {
	      this.show = true
	    },
		   
	   //调手机号授权登录,获取code
	    getPhoneNumber(e) {
	      this.show = false
	      this.getPhoneNumberObj = e
	      let self = this
	      if (e.detail.errMsg == 'getPhoneNumber:fail user deny') {
	        return
	      }
	      if (!uni.checkSession || !this.isLogin) {
	        console.log('登录状态失效 :>> ')
	        uni.login({
	          provider: 'weixin',
	          success: function (res) {
	            self.parWX.code = res.code
	            self.wxLogin(e)
	          },
	        })
	      } else {
	        self.wxLogin(e)
	      }
	    },
	    wxLogin(e) {
	      uni.showLoading({
	        title: '登录中',
	        mask: true,
	      })
	      let self = this
	      self.parWX.iv = e.detail.iv
	      self.parWX.encryptedData = e.detail.encryptedData
	      const params = {
	        iv: e.detail.iv,
	        encryptedData: e.detail.encryptedData,
	        code: self.parWX.code,
	        app: this.config.clientId,
	        uuid: this.uuid,
	        clientId: this.config.clientId,
	        clientSecret: this.config.clientSecret,
	        requestType: 2,
	        appVersion: '11.1',
	        sysVersion: '10.1',
	      }
	      post('/api-base-user/web-chat/login', params)
	        .then((d) => {
	          this.loginSuccess(d)
	        })
	        .catch((err) => {
	          uni.login({
	            provider: 'weixin',
	            success: function (res) {
	              self.parWX.code = res.code
	            },
	          })
	        })
	        .finally(() => {
	          uni.hideLoading()
	        })
	    },
	    
	   
	    loginSuccess(data) {
	      this.IsLogin(false)
	      this.Token(data.ticketToken.accessValue)
	      this.IsLogin(true)
	      if (this.config.env == 'dev') {
	        cache.set('phone', this.parLoginPwd.phone)
	        cache.set('password', this.parLoginPwd.password)
	      }
	      uni.navigateBack()
	    },
	    close() {
	      this.show = false
	    }
	  },
	}
	</script>
	<style>
	.cus-modal-cent {
	  width: 500rpx;
	}
	
	.cus-header {
	  width: 500rpx;
	  display: flex;
	  justify-content: flex-start;
	  margin-bottom: 50rpx;
	  align-items: center;
	
	  .error-cir-style {
	    margin-right: 20rpx;
	    display: inline-block;
	  }
	
	  .tips-infor {
	    margin-left: 24rpx;
	    color: #000000;
	    font-size: 28rpx;
	  }
	}
	
	.cus-btn {
	  width: 500rpx;
	  display: flex;
	  justify-content: space-between;
	}
	
	::v-deep .u-button {
	  width: 200rpx !important;
	}
	</style>

在这里插入图片描述
![在这里插入图片描述](https://i-blog.csdnimg.cn/direct/efe8d20b28424019b73a8c0cc85c9362.jpeg#pic_center
在这里插入图片描述
在这里插入图片描述

评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值