微信小程序用户拒绝授权的处理方法详解


Posted in Javascript onSeptember 20, 2019

前言

小程序开发中,现在一般都需要获取微信用户信息,如头像/名字等.这样在用户第一次进入小程序时,微信端会弹出一个是否同意授权的消息提示框.但是如果用户第一时间点击了拒绝,或者用户手误点击了拒绝,如果没有了后续的操作,可能你的小程序就不能使用了,也就会失去这样一位用户.

所以,微信官方推荐了一个方法,就是在用户第一次拒绝授权的时候,再给用户一个选择的机会.这样能很好的解决上诉问题.下面以用户需要授权两个权限为例,方法如下:

在 APP.JS 先设置两个全局变量 .用作记录用户是否授权

//判断地理位置是否请求成功
var locationBool;
//判断用户信息是否请求成功
var userInfoBool;

的 APP({})中

1.获取用户当前位置信息(获取成功后将数据存入缓存,方便后面使用)

//获取地理位置
  wxGetlocation: function() {
    console.log('微信获取地理')
    wx.getLocation({
      type: 'wgs84',
      //请求成功
      success: function(res) {
        locationBool = true;
        wx.setStorage({
          key: 'locationWx',
          data: {
            applatitude: res.latitude,
            applongitude: res.longitude
          }
        })
      },
      fail: function() {
        locationBool = false;
      }
    })
  },

2.获取用户资料信息:

这里需要注意的是:  现在一般开发小程序都需要做服务器登录.由于后端的解密方式的选择问题,后端可以只用用户code 解密,也有可能需要用到 encryptedData/iv 这两个参数拿去后台解密,换取用户token 来做更多的操作. 如需获取encryptedData/iv 这两个参数, 必须在微信wx.login({})之后再去获取 否则这两个参数可能会出现问题

    //获取用户信息(获取之前必须login)
    wxGetUserInfo: function() {
        console.log('微信获取用户信息')
        wx.getUserInfo({
            //请求成功
            withCredentials: true,
            success: function(data) {
                userInfoBool = true;
                wx.setStorage({
                    key: 'UserInfoWx',
                    data: data
                })
            },
            fail: function() {
                userInfoBool = false;
            }
        })
    },
logInWx: function() {
    var _this = this;
    wx.login({
      success: res => {
        console.log('微信登录')
        console.log(res)
        //如果登录成功
        var usercode = res.code; //用户code
        if (res.code) {
          wx.setStorage({
            key: 'usercode',
            data: usercode
          })          
          //请求用户信息设置缓存(获得nickname/avatarurl/gender/iv/encryptedData)
          _this.wxGetUserInfo();
        }
      }
    })
  }

在小程序中,微信提供了这样一个方法wx.openSetting({}) 他可以弹出小程序设置授权的页面.下面即是 用户拒绝授权之后的处理方法.

getPromission: function() {
    var _this = this;
    // 位置信息,用户信息中其中一个数据没有获取到(--->弹出设置界面)
    if (locationBool == false || userInfoBool == false) {
      // 显示提示弹窗(重新授权)
      wx.showModal({
        title: '用户未授权',
        content: '请开启相应的权限哦~',
        showCancel: false,
        success: res => {
          if (res.confirm) {
            //点击取消,重新获取授权
            wx.openSetting({
              success: data => {
                console.log(data)
                if (data) {
                  if (data.authSetting["scope.userInfo"] == true && data.authSetting["scope.userLocation"] == false) {
                    //再次获取用户信息
                    console.log('只获取用户信息')
                    _this.wxGetUserInfo()
                  } else if (data.authSetting["scope.userInfo"] == false && data.authSetting["scope.userLocation"] == true) {
                    //再次获取位置信息
                    _this.wxGetlocation()
                    console.log('只获取位置信息')
                  } else if (data.authSetting["scope.userInfo"] == true && data.authSetting["scope.userLocation"] == true) {
                    //再次获取用户和位置信息
                    _this.wxGetUserInfo()
                    _this.wxGetlocation()
                    console.log('获取全部信息')
                  }
                }
              },
              fail: function() {
                console.info("设置页面失败");
              }
            });
          }
        }
      });
    }
  },

然后在app.js onlaunch中

onLaunch: function(e) {
    var _this = this
    _this.wxGetlocation();
    //微信登录
    //如果没有获取数据成功.
    var timer = setInterval(function() {
      if (locationBool != undefined && userInfoBool != undefined) {
        clearInterval(timer)
        _this.getPromission();
      }
    }, 200)  
  },

以上就是本文的全部内容,希望对大家的学习有所帮助,也希望大家多多支持三水点靠木。

Javascript 相关文章推荐
FireFox中textNode分片的问题
Apr 10 Javascript
Js 获取HTML DOM节点元素的方法小结
Apr 24 Javascript
微博@符号的用户名提示效果。(想@到谁?)
Nov 05 Javascript
JavaScript建立一个语法高亮输入框实现思路
Feb 26 Javascript
Jquery api 速查表分享
Jan 12 Javascript
js控制网页背景音乐播放与停止的方法
Feb 06 Javascript
jquery仿百度经验滑动切换浏览效果
Apr 14 Javascript
Javascript中toFixed计算错误(依赖银行家舍入法的缺陷)解决方法
Aug 22 Javascript
从setTimeout看js函数执行过程
Dec 19 Javascript
在node中使用jwt签发与验证token的方法
Apr 03 Javascript
微信小程序定义和调用全局变量globalData的实现
Nov 01 Javascript
vue 避免变量赋值后双向绑定的操作
Nov 07 Javascript
解决layui动态加载复选框无法选中的问题
Sep 20 #Javascript
vuejs+element UI table表格中实现禁用部分复选框的方法
Sep 20 #Javascript
layui table复选框禁止某几条勾选的实例
Sep 20 #Javascript
教你如何用Node实现API的转发(某音乐)
Sep 20 #Javascript
使用layui实现树形结构的方法
Sep 20 #Javascript
生成无限制的微信小程序码的示例代码
Sep 20 #Javascript
浅谈layui分页控件field参数接收对象的问题
Sep 20 #Javascript
You might like
PHP判断指定时间段的2个方法
2014/03/14 PHP
PHP字符串比较函数strcmp()和strcasecmp()使用总结
2014/11/19 PHP
smarty自定义函数htmlcheckboxes用法实例
2015/01/22 PHP
Linux+Nginx+MySQL下配置论坛程序Discuz的基本教程
2015/12/23 PHP
基于mootools插件实现遮罩层新手引导
2012/05/24 Javascript
JQuery入门——事件切换之toggle()方法应用介绍
2013/02/05 Javascript
网页前端优化之滚动延时加载图片示例
2013/07/13 Javascript
按下Enter焦点移至下一个控件的实现js代码
2013/12/11 Javascript
jquery制作弹窗提示窗口代码分享
2014/03/02 Javascript
JS动态添加Table的TR,TD实现方法
2015/01/28 Javascript
JavaScript原生对象之Date对象的属性和方法详解
2015/03/13 Javascript
基于Javascript实现二级联动菜单效果
2016/03/04 Javascript
JavaScript实现复制或剪切内容到剪贴板功能的方法
2016/05/23 Javascript
浅谈bootstrap源码分析之tab(选项卡)
2016/06/06 Javascript
javascript数组遍历的方法实例分析
2016/09/13 Javascript
KVM虚拟化技术之使用Qemu-kvm创建和管理虚拟机的方法
2016/10/05 Javascript
jQuery下拉菜单的实现代码
2016/11/03 Javascript
jquery pagination插件动态分页实例(Bootstrap分页)
2016/12/23 Javascript
jQuery实现级联下拉框实战(5)
2017/02/08 Javascript
基于JS代码实现简单易用的倒计时 x 天 x 时 x 分 x 秒效果
2017/07/13 Javascript
JS实现前端动态分页码代码实例
2020/06/02 Javascript
SpringBoot在yml配置文件中配置druid的操作
2020/11/16 Javascript
npm全局环境变量配置详解
2020/12/15 Javascript
[43:26]完美世界DOTA2联赛PWL S2 Forest vs Rebirth 第二场 11.20
2020/11/23 DOTA
python对list中的每个元素进行某种操作的方法
2018/06/29 Python
python运行时强制刷新缓冲区的方法
2019/01/14 Python
PySide和PyQt加载ui文件的两种方法
2019/02/27 Python
django将网络中的图片,保存成model中的ImageField的实例
2019/08/07 Python
Python 实现大整数乘法算法的示例代码
2019/09/17 Python
python TCP包注入方式
2020/05/05 Python
pandas之分组groupby()的使用整理与总结
2020/06/18 Python
5s标语大全
2014/06/23 职场文书
校长师德师风自我剖析材料
2014/09/29 职场文书
优秀校长事迹材料
2014/12/24 职场文书
任长霞观后感
2015/06/16 职场文书
使用vue-element-admin框架从后端动态获取菜单功能的实现
2021/04/29 Vue.js