微信小程序授权及检测访问当前页面需要去登录的操作
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() {},
// onLoad() {
// 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
在需要授权的页面写入

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

参考链接:https://www.cnblogs.com/yxg2852/p/16281923.html
版权申明:内容来源网络,版权归原创者所有。除非无法确认,都会标明作者及出处,如有侵权,烦请告知,我们会立即删除并致歉!
微信扫一扫 关注公众号

微信小程序授权及检测访问当前页面需要去登录的操作的更多相关文章
- 完整微信小程序授权登录页面教程
完整微信小程序授权登录页面教程 1.前言 微信官方对getUserInfo接口做了修改,授权窗口无法直接弹出,而取而代之是需要创建一个button,将其open-type属性绑定getUseInfo方 ...
- 微信小程序开发:学习笔记[8]——页面跳转及传参
微信小程序开发:学习笔记[8]——页面跳转及传参 页面跳转 一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面.在首页使用2次wx.navigateTo后,页面层级会有三层 ...
- 微信小程序授权获取用户详细信息openid
小程序获取用户的头像昵称openid之类 第一种使用wx.getUserInfo直接获取微信头像,昵称 wx.getUserInfo({ success: function (res) { that. ...
- 微信小程序授权 获取用户的openid和session_key【后端使用java语言编写】,我写的是get方式,目的是测试能否获取到微信服务器中的数据,后期我会写上post请求方式。
在这里给大家分享下我的心得,1.写代码前一定要对整个流程有个了解.我就是因为在先不了解整个过程中去ctrl+c+v他人的博客代码,花费很多无用的时间去处理还不知道能不能跑的起来的代码. 2.本人比较喜 ...
- uni-app开发经验分享二十: 微信小程序 授权登录 获取详细信息 获取手机号
授权页面 因为微信小程序提供的 权限弹窗 只能通用户确认授权 所以可以 写一个授权页面,让用户点击 来获取用户相关信息 然后再配合后台就可以完成登录 <button class="bt ...
- uni-app 微信小程序授权登录
1.微信小程序 获取用户信息 与获取手机号 详细信息看官方公告:https://developers.weixin.qq.com/community/develop/doc/000cacfa20ce8 ...
- 微信小程序授权登录将open_id传至后台并入库
要求能把用户昵称.头像以及open_id写入数据库,服务端保持用户登录状态 wxml: <block wx:else> <button type="primary" ...
- 微信小程序 - 授权页面
小程序授权方式更改以后,我们只有两种选择. 1.在主页使用遮罩层,类似这样的(会造成一点卡顿) 2.新增登陆授权页(经过反复的思考,我还是觉得用这个好) 这个也不错: https://blog.csd ...
- 微信小程序授权获取手机号
wxml: <text>pages/logins/logins.wxml</text> // <button open-type="getPhoneNumber ...
- 微信小程序入门教程之二:页面样式
这个系列的上一篇教程,教大家写了一个最简单的 Hello world 微信小程序. 但是,那只是一个裸页面,并不好看.今天接着往下讲,如何为这个页面添加样式,使它看上去更美观,教大家写出实际可以使用的 ...
随机推荐
- ubuntu22.04 git升级
git --version //查看版本 sudo add-apt-repository ppa:git-core/ppa //通过PPA源方式安装软件的添加PPA源到Source list中的 ...
- C# 连接SQLSERVER数据库常用操作类
//数据库连接字符串 public static string connectStr = @"server=.;database=test;uid=sa;pwd=123456;"; ...
- 两步解决php超时问题
tp的报错很模糊,需要自己判断是不是超时问题 首先给Apache的配置文件httpd.conf添加几行: <IfModule mod_fcgid.c> FcgidProcessLifeTi ...
- excel添加下拉列表
2016年数据验证,2010是数据校验
- having对聚合函数的结果集进行过滤
SELECT rl.road_code,string_agg(distinct rs.tech_level_label, ',') from road_lst rlleft join road_sec ...
- cypress初探
long long ago就已经被各大公众号洗脑这款神奇的工具,那我们一起来学习下吧(基础入门安装,边学习边记录,勿喷谢谢) 第一步:访问官方网站:https://www.cypress.io/ 第二 ...
- winform 更新下载压缩文件解压并覆盖
using System; using System.Collections.Generic; using System.ComponentModel; using System.Data; usin ...
- CentOS6.8安装docker教程
在VMware新安装CentOS6.8系统 CentOS6.8可在阿里镜像库下载: https://mirrors.aliyun.com/centos-vault/6.8/isos/x86_64/ 在 ...
- 单个Java文件连接数据库demo
在单个java文件中,尝试连接数据库,跟python的模块包安装方式很接近,已经测试成功,把博客写一下,记录下来. 首先把jdb的驱动包下载下来,就是一个jar包,下面是官网下载地址 官网下载 ...
- Win10在线升级Win11
下载微软官方在线升级工具,直接一键在线升级 https://www.microsoft.com/zh-cn/software-download/windows11/ 右键菜单一键恢复win10风格,管 ...