ICode9

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

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

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

标签: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

本站声明: 1. iCode9 技术分享网(下文简称本站)提供的所有内容,仅供技术学习、探讨和分享;
2. 关于本站的所有留言、评论、转载及引用,纯属内容发起人的个人观点,与本站观点和立场无关;
3. 关于本站的所有言论和文字,纯属内容发起人的个人观点,与本站观点和立场无关;
4. 本站文章均是网友提供,不完全保证技术分享内容的完整性、准确性、时效性、风险性和版权归属;如您发现该文章侵犯了您的权益,可联系我们第一时间进行删除;
5. 本站为非盈利性的个人网站,所有内容不会用来进行牟利,也不会利用任何形式的广告来间接获益,纯粹是为了广大技术爱好者提供技术内容和技术思想的分享性交流网站。

专注分享技术,共同学习,共同进步。侵权联系[81616952@qq.com]

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

ICode9版权所有