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


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 相关文章推荐
Dom操作之兼容技巧分享
Sep 20 Javascript
js获取页面传来参数的方法
Sep 06 Javascript
通过实例理解javascript中没有函数重载的概念
Jun 03 Javascript
14款经典网页图片和文字特效的jQuery插件-前端开发必备
Aug 25 Javascript
微信小程序 input输入框控件详解及实例(多种示例)
Dec 14 Javascript
React Native自定义控件底部抽屉菜单的示例
Feb 08 Javascript
webpack vue项目开发环境局域网访问方法
Mar 20 Javascript
Vue组件之极简的地址选择器的实现
May 31 Javascript
vue.js实现带日期星期的数字时钟功能示例
Aug 28 Javascript
基于JS实现简单滑块拼图游戏
Oct 12 Javascript
手把手教你从零开始react+antd搭建项目
Jun 03 Javascript
js面向对象编程OOP及函数式编程FP区别
Jul 07 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采集时被封ip的解决方法
2010/08/29 PHP
具有时效性的php加密解密函数代码
2013/06/19 PHP
PHP下载文件的函数实例代码
2016/05/18 PHP
一张Web前端的思维导图分享
2015/07/03 Javascript
jQuery图片旋转插件jQueryRotate.js用法实例(附demo下载)
2016/01/21 Javascript
jquery实现一个简单的表单验证实例
2016/03/30 Javascript
JS实现json的序列化和反序列化功能示例
2017/06/13 Javascript
iframe与主框架跨域相互访问实现方法
2017/09/14 Javascript
arcgis for js栅格图层叠加(Raster Layer)问题
2017/11/22 Javascript
Vue 组件(component)教程之实现精美的日历方法示例
2018/01/08 Javascript
vue 父组件调用子组件方法及事件
2018/03/29 Javascript
Vue中axios的封装(报错、鉴权、跳转、拦截、提示)
2019/08/20 Javascript
防止Layui form表单重复提交的实现方法
2019/09/10 Javascript
[51:22]Fnatic vs IG 2018国际邀请赛小组赛BO2 第一场 8.17
2018/08/18 DOTA
[56:42]完美世界DOTA2联赛循环赛 Matador vs Forest 第二场 11.06
2020/11/06 DOTA
用Python编写一个基于终端的实现翻译的脚本
2015/04/24 Python
在Python中使用正则表达式的方法
2015/08/13 Python
Python中字典和集合学习小结
2017/07/07 Python
Python占用的内存优化教程
2019/07/28 Python
Python猴子补丁知识点总结
2020/01/05 Python
Jupyter Notebook的连接密码 token查询方式
2020/04/21 Python
python不到50行代码完成了多张excel合并的实现示例
2020/05/28 Python
python软件都是免费的吗
2020/06/18 Python
windows下python 3.9 Numpy scipy和matlabplot的安装教程详解
2020/11/28 Python
YOOX美国官方网站:全球著名的多品牌时尚网络概念店
2016/09/11 全球购物
超30万乐谱下载:Musicnotes.com
2016/09/24 全球购物
Wedgwood美国官网:英国骨瓷,精美礼品及家居装饰
2018/02/17 全球购物
欧洲著名的二手奢侈品网站:Vestiaire Collective
2020/03/07 全球购物
《桂花雨》教学反思
2014/04/12 职场文书
人力资源管理专业应届生求职信
2014/04/24 职场文书
解除财产保全担保书
2014/05/20 职场文书
孕妇离婚协议书范本
2014/11/20 职场文书
大学生自荐书范文
2015/03/05 职场文书
商场圣诞节活动总结
2015/05/06 职场文书
python 模块重载的五种方法
2021/04/24 Python
关于Python使用turtle库画任意图的问题
2022/04/01 Python