微信小程序授权登陆及每次检查是否授权实例代码


Posted in Javascript onSeptember 18, 2019

授权登录

<button open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="onGotUserInfo" class="fix">登录</button>
//index.js
//获取应用实例
var APPID ='xxx'
var SECRET = 'xxx'
const app = getApp()
Page({
 data: {
  list:[],
  userInfo:null
 },
 //事件处理函数
 onGotUserInfo:function (e) {
  if (e.detail.userInfo != undefined && app.globalData.isok == false) {
   console.log(e.detail.userInfo)
     wx.login({
      success: function (data) {
       console.log('获取登录 Code:' + data.code)
       var postData = {
        code: data.code
       };
       wx.request({
        // url: 'https://api.weixin.qq.com/sns/jscode2session?appid=' + APPID + '&secret=' + SECRET + '&js_code=' + postData.code + '&grant_type=authorization_code',
        url: 'https://m.renyiwenzhen.com/rymember.php?mod=xcxlogin&code=' + postData.code + '&nickname=' + e.detail.userInfo.nickName,
        data: {},
        header: {
         'content-type': 'application/json'
        },
        success: function (res) {
         // openid = res.data.openid //返回openid
         console.log(res.data);
         wx.setStorage({
          key: "unionid",
          data: res.data.unionid
         })
         wx.navigateTo({
          url: '../archives/archives'
         })
        },
        fail: function () {
         console.log('1');
        }
       })
      },
      fail: function () {
       console.log('登录获取Code失败!');
      }
     })


  }
  else if (app.globalData.isok==true) {
      wx.navigateTo({
       url: '../archives/archives'
      })
  }
 },
 onLoad: function () {
  var that =this
  wx.request({
   url: 'https://m.xxx.com/xcx_ajax.php?action=yimiaolist', //仅为示例,并非真实的接口地址
   method: 'post',
   header: {
    'content-type': 'application/json' // 默认值
   },
   success(res) {
    console.log(res.data)
    that.setData({
     list: res.data
    })
   }
  })
   if (app.globalData.userInfo) { //获取用户信息是一个异步操作,在onLoad函数加载的时候app.js中的onLaunch可能还没有加载,所以需要判断是否获取成功
    this.setData({
     userInfo: app.globalData.userInfo,
     hasUserInfo: true
    })
   } else if (this.data.canIUser) { //判断canIUser的值是否为true,实则在判断微信小程序版本是否支持相关属性 
    app.userInfoReadyCallback = (res) => { // userInfoReadyCallback:userInfo的回调函数,声明一个回调函数,将回调函数传给app.js,userInfo加载完成后会执行这个回调函数,这个回调函数会将获取的getUserInfo的结果直接传回来
     // 在app.js中获取用户信息之后调用这个函数,结果放在函数的参数中
     this.setData({
      userInfo: res.userInfo,
      hasUserInfo: true
     })
    }
   } else {
    wx.getUserInfo({ //在老的版本中是可以直接调用授权接口并获取用户信息
     success: (res) => {
      this.setData({
       userInfo: res.userInfo,
       hasUserInfo: true
      })
     }
    })
   }
 }
})

每次检查是否授权

//app.js
App({
  globalData: {
   userInfo: null,
   isok:false,
   unionid:null
  },
 onLaunch: function () {
 /* 已授权之后,自动获取用户信息 */
 // 判断是否授权
 wx.getSetting({
  success: (res) => { //箭头函数为了处理this的指向问题 
   if (res.authSetting["scope.userInfo"]) {
    console.log("已授权");
    // 获取用户信息
    wx.getUserInfo({
     success: (res) => { //箭头函数为了处理this的指向问题
      this.globalData.isok=true
      var that =this
      console.log(res.userInfo); //用户信息结果
      wx.getStorage({
       key: 'unionid',
       success(res) {
        that.globalData.unionid=res.data
       }
      })
      this.globalData.userInfo = res.userInfo;
      if (this.userInfoReadyCallback) { //当index.js获取到了globalData就不需要回调函数了,所以回调函数需要做做一个判断,如果app.js中有和这个回调函数,那么就对这个函数进行调用,并将请求到的结果传到index.js中
       this.userInfoReadyCallback(res.userInfo);
      }
     }
    })
   }
   else{
    console.log("未授权");
    wx.removeStorage({
     key: 'unionid'
    })
   }
  }
 })
 }
})

总结

以上所述是小编给大家介绍的微信小程序授权登陆及每次检查是否授权实例代码,希望对大家有所帮助,如果大家有任何疑问请给我留言,小编会及时回复大家的。在此也非常感谢大家对三水点靠木网站的支持!
如果你觉得本文对你有帮助,欢迎转载,烦请注明出处,谢谢!

Javascript 相关文章推荐
关于实现代码语法标亮 dp.SyntaxHighlighter
Feb 02 Javascript
JS 实现点击a标签的时候让其背景更换
Oct 15 Javascript
原生js做的手风琴效果的导航菜单
Nov 08 Javascript
JS+CSS实现可拖动的弹出提示框
Feb 16 Javascript
jquery中JSON的解析方式
Mar 16 Javascript
js利用appendChild对标签进行排序的实现方法
Oct 16 Javascript
清除js缓存的多种方法总结
Dec 09 Javascript
React Native时间转换格式工具类分享
Oct 24 Javascript
微信小程序实现美团菜单
Jun 06 Javascript
jQuery阻止事件冒泡实例分析
Jul 03 jQuery
vue点击弹窗自动触发点击事件的解决办法(模拟场景)
May 25 Vue.js
AngularJS实现多级下拉框
Mar 25 Javascript
layui的layedit富文本赋值方法
Sep 18 #Javascript
vue语法自动转typescript(解放双手)
Sep 18 #Javascript
快速解决layui弹窗按enter键不停弹窗的问题
Sep 18 #Javascript
layui 实现二级弹窗弹出之后 关闭一级弹窗的方法
Sep 18 #Javascript
使用Node.js在深度学习中做图片预处理的方法
Sep 18 #Javascript
过滤器vue.filters的使用方法实现
Sep 18 #Javascript
layui问题之自动滚动二级iframe页面到指定位置的方法
Sep 18 #Javascript
You might like
PHP的历史和优缺点
2006/10/09 PHP
微信支付开发交易通知实例
2016/07/12 PHP
php实现PDO中捕获SQL语句错误的方法
2017/02/16 PHP
PHP长连接实现与使用方法详解
2018/02/11 PHP
扩展Jquery插件处理mouseover时内部有子元素时发生样式闪烁
2011/12/08 Javascript
Jquery给基本控件的取值、赋值示例
2014/05/23 Javascript
JS封装cookie操作函数实例(设置、读取、删除)
2015/11/17 Javascript
学做Bootstrap的第一个页面
2016/05/15 HTML / CSS
js删除Array数组中指定元素的两种方法
2016/08/03 Javascript
Angularjs在初始化未完毕时出现闪烁问题的解决方法分析
2016/08/05 Javascript
Vue.js实现拖放效果的实例
2016/09/30 Javascript
Node.js 8 中的重要新特性
2017/06/28 Javascript
vue学习教程之带你一步步详细解析vue-cli
2017/12/26 Javascript
JavaScript实现计算多边形质心的方法示例
2018/01/31 Javascript
vue路由拦截及页面跳转的设置方法
2018/05/24 Javascript
Angularjs中的$apply及优化使用详解
2018/07/02 Javascript
如何测量vue应用运行时的性能
2019/06/21 Javascript
Vue获取页面元素的相对位置的方法示例
2020/02/05 Javascript
JavaScript 防盗链的原理以及破解方法
2020/12/29 Javascript
python实现的简单RPG游戏流程实例
2015/06/28 Python
Python实现二叉堆
2016/02/03 Python
Python常用的爬虫技巧总结
2016/03/28 Python
深入理解Python变量与常量
2016/06/02 Python
Python之inspect模块实现获取加载模块路径的方法
2018/10/16 Python
用Python编写一个简单的CS架构后门的方法
2018/11/20 Python
python实现代码统计程序
2019/09/19 Python
Html5获取高德地图定位天气的方法
2019/12/26 HTML / CSS
html5视频自动横过来自适应页面且点击播放功能的实现
2020/06/03 HTML / CSS
SkinCeuticals官网:美国药妆品牌
2018/04/19 全球购物
鼓励运动员的广播稿
2014/02/08 职场文书
机电专业毕业生求职信
2014/07/01 职场文书
助残日活动总结
2014/08/27 职场文书
房屋出售授权委托书
2014/10/12 职场文书
个人查摆问题及整改措施
2014/10/16 职场文书
公司市场部岗位职责
2015/04/15 职场文书
Pytorch数据读取之Dataset和DataLoader知识总结
2021/05/23 Python