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


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 相关文章推荐
js Flash插入函数免激活代码
Mar 31 Javascript
制作高质量的JQuery Plugin 插件的方法
Apr 20 Javascript
图片上传插件jquery.uploadify详解
Nov 15 Javascript
Javascript中常见的校验如域名、手机、邮箱等等
Jan 02 Javascript
浅谈javascript中自定义模版
Jan 29 Javascript
javascript中$(function() {});写与不写有哪些区别
Aug 10 Javascript
js中遍历对象的属性和值的方法
Jul 27 Javascript
基于cssSlidy.js插件实现响应式手机图片轮播效果
Aug 30 Javascript
微信小程序 滚动到某个位置添加class效果实现代码
Apr 19 Javascript
HTML5+Canvas调用手机拍照功能实现图片上传(下)
Apr 21 Javascript
Node.JS使用Sequelize操作MySQL的示例代码
Oct 09 Javascript
vue中引用阿里字体图标的方法
Feb 10 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
成本8450万,票房仅2亿,口碑两极分化,又一部DC电影扑街了
2020/04/09 欧美动漫
同一空间绑定多个域名而实现访问不同页面的PHP代码
2006/12/06 PHP
js常用函数 不错
2006/09/08 Javascript
短信提示使用 特效
2007/01/19 Javascript
DLL+ ActiveX控件+WEB页面调用例子
2010/08/07 Javascript
获取css样式表内样式的js函数currentStyle(IE),defaultView(FF)
2011/02/14 Javascript
JavaScript简单实现网页回到顶部功能
2013/11/12 Javascript
js通过元素class名字获取元素集合的具体实现
2014/01/06 Javascript
基于Echarts 3.19 制作常用的图形(非静态)
2016/05/19 Javascript
IONIC自定义subheader的最佳解决方案
2016/09/22 Javascript
jQGrid动态填充select下拉框的选项值(动态填充)
2016/11/28 Javascript
Angular工具方法学习
2016/12/26 Javascript
Angular2 组件通信的实例代码
2017/06/23 Javascript
webpack2.0配置postcss-loader的方法
2017/08/17 Javascript
React Native之prop-types进行属性确认详解
2017/12/19 Javascript
react以create-react-app为基础创建项目
2018/03/14 Javascript
jquery.onoff实现简单的开关按钮功能(推荐)
2018/05/24 jQuery
js中int和string数据类型互相转化实例
2019/01/16 Javascript
vue 判断页面是首次进入还是再次刷新的实例
2020/11/05 Javascript
Python实现的读取/更改/写入xml文件操作示例
2018/08/30 Python
python程序变成软件的实操方法
2019/06/24 Python
基于python实现把图片转换成素描
2019/11/13 Python
Python自动重新加载模块详解(autoreload module)
2020/04/01 Python
aws 通过boto3 python脚本打pach的实现方法
2020/05/10 Python
Python图像读写方法对比
2020/11/16 Python
处理textarea中的换行和空格
2019/12/12 HTML / CSS
佐卡伊官网:中国知名珠宝品牌
2017/02/05 全球购物
英国豪华真皮和布艺沙发销售网站:Darlings of Chelsea
2018/01/05 全球购物
财务管理个人自荐书范文
2013/11/24 职场文书
高一新生军训感言
2014/03/02 职场文书
房产继承公证书
2014/04/09 职场文书
2014党员四风对照检查材料思想汇报
2014/09/17 职场文书
医院领导班子查摆问题对照检查材料思想汇报
2014/10/08 职场文书
师德标兵事迹材料
2014/12/19 职场文书
小学元宵节活动总结
2015/02/06 职场文书
MySQL数据库如何使用Shell进行连接
2022/04/12 MySQL