ICode9

精准搜索请尝试: 精确搜索
首页 > 编程语言> 文章详细

微信小程序授权及检测访问当前页面需要去登录的操作

2022-05-17 18:35:48  阅读:33  来源: 互联网

标签:openid 登录 微信 app res 授权 页面 data wx


1、小程序授权登录

这里我直接复制代码:

login.js

const app = getApp()
Page({
  data: {
    //判断小程序的API,回调,参数,组件等是否在当前版本可用。
    canIUse: wx.canIUse('button.open-type.getUserInfo'),
    userinfoObj: {}
  },
  // 授权按钮
  bindGetUserInfo: function (e) {
    wx.getUserProfile({
      desc: '业务需要',
      lang: 'zh_CN',
      success: res1 => {
        // wx.setStorageSync('nickName', res1.userInfo.nickName) // 授权缓存用户昵称
        // wx.setStorageSync('avatarUrl', res1.userInfo.avatarUrl) // 授权缓存用户头像
        this.setData({
          userinfoObj: {
            ...this.data.userinfoObj,
            nickName: res1.userInfo.nickName,
            avatarUrl: res1.userInfo.avatarUrl
          }
        })
        wx.login({
          success: res => {
            this.getUserOpenId(res.code)
          }
        });
      },
      fail: function () {
        wx.showModal({
          title: '提示',
          content: '您拒绝了授权,无法正常使用小程序 重新授权',
          showCancel: false,
          confirmText: '重新授权',
          success: function (res) {
            if (res.confirm) {
              console.log('用户点击了"重新授权"')
            }
          }
        })
      }
    })
  },
  // 通过code获取openid
  getUserOpenId(code) {
    let postData = {
      code,
      appid: app.globalData.appid,
      parentUserid: wx.getStorageSync('parentUserid') || ''
    }
    app.requestData('xxx', {
      ...postData
    }).then((res) => {
      if (res.result === 'success') {
        // wx.setStorageSync('sessionKey', res.data.sessionKey) // 缓存sessionKey
        wx.setStorageSync('openid', res.data.wxId) // 缓存openid
        this.setData({
          userinfoObj: {
            ...this.data.userinfoObj,
            openid: res.data.wxId
          }
        })
        console.log('wxId', res.data.wxId)
        this.insertUserInfo()
      } else {
        app.showTip(res.msg)
      }
    })
  },
  // 将 openid 头像、昵称 入库
  insertUserInfo() {
    app.requestData('xxx', {
      nickName: this.data.userinfoObj.nickName,
      openid: this.data.userinfoObj.openid,
      avatarUrl: this.data.userinfoObj.avatarUrl,
      parentUserid: wx.getStorageSync('parentUserid') || ''
    }).then((res) => {
      if (res.result === 'success') {
        var value = wx.getStorageSync('urlWithArgs')
        app.checkIslogin(function () {
          if (value !== '') {
            wx.redirectTo({
              url: value,
            })
          } else {
            wx.switchTab({
              url: '../mine/index',
            })
          }
        })
      } else {
        app.showTip(res.msg)
      }
    })
  },
  // 通过openid获取手机号
  updateWinxinUserMobile() {},
  // onl oad() {
  //   wx.showModal({
  //     title: '提示',
  //     content: wx.getStorageSync('parentUserid'),
  //     success (res) {
  //       if (res.confirm) {
  //         console.log('用户点击确定')
  //       } else if (res.cancel) {
  //         console.log('用户点击取消')
  //       }
  //     }
  //   })
  // }
})

login.xml

<!--pages/login/index.wxml-->
<view wx:if="{{canIUse}}">
 <view class='header'>
  <image src='../../image/logo.jpg'></image>
 </view>
 
 <view class='content'>
  <view>申请获取以下权限</view>
  <text>获得你的公开信息(昵称,头像等)</text>
 </view>
 
  <button class='bottom' type='primary' bindtap="bindGetUserInfo">
  微信一键登录
 </button>
</view>
 
<view wx:else>请升级微信版本</view>

2、众所周知,小程序进去之后不能立马弹出授权页面,要让用户可以浏览部分页面,这里就要监测用户是否有授权了

可以在app.js里写一个全局的函数

  onLaunch() {
    this.checkIslogin()
  },
  // 检测用户是否已经授权登录过, 登录过就获取用户信息
  checkIslogin(callback) {
    const openid = wx.getStorageSync('openid')
    const _this = this
    if (!openid) {
      this.globalData.isLogin = false
    } else {
      this.globalData.isLogin = true
      this.requestData('xxx', {
        openid: openid,
        parentUserid: wx.getStorageSync('parentUserid') || ''
      }).then((response) => {
        if (response.result === 'success') {
          _this.globalData.userInfo = response.data
          console.log(response.data)
          // if (!response.data.nickName) {
          //   _this.globalData.isLogin = false
          // }
          typeof callback == 'function' && callback()
        } else {
          _this.showTip(response.msg)
        }
      })
    }
  },

 

我这里是定义了一个全局变量 isLogin

在需要授权的页面写入

  onl oad() {
    if (!app.globalData.isLogin) {
      wx.navigateTo({
        url: '/pages/login/index',
      })
    } else {
      //this.queryuserdetail() // 用户详情
      //this.queryCount() // 用户计数
    }
  },

 

标签:openid,登录,微信,app,res,授权,页面,data,wx
来源: https://www.cnblogs.com/yxg2852/p/16281923.html

专注分享技术,共同学习,共同进步。侵权联系[admin#icode9.com]

Copyright (C)ICode9.com, All Rights Reserved.

ICode9版权所有