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. 完整微信小程序授权登录页面教程

    完整微信小程序授权登录页面教程 1.前言 微信官方对getUserInfo接口做了修改,授权窗口无法直接弹出,而取而代之是需要创建一个button,将其open-type属性绑定getUseInfo方 ...

  2. 微信小程序开发:学习笔记[8]——页面跳转及传参

    微信小程序开发:学习笔记[8]——页面跳转及传参 页面跳转 一个小程序拥有多个页面,我们可以通过wx.navigateTo推入一个新的页面.在首页使用2次wx.navigateTo后,页面层级会有三层 ...

  3. 微信小程序授权获取用户详细信息openid

    小程序获取用户的头像昵称openid之类 第一种使用wx.getUserInfo直接获取微信头像,昵称 wx.getUserInfo({ success: function (res) { that. ...

  4. 微信小程序授权 获取用户的openid和session_key【后端使用java语言编写】,我写的是get方式,目的是测试能否获取到微信服务器中的数据,后期我会写上post请求方式。

    在这里给大家分享下我的心得,1.写代码前一定要对整个流程有个了解.我就是因为在先不了解整个过程中去ctrl+c+v他人的博客代码,花费很多无用的时间去处理还不知道能不能跑的起来的代码. 2.本人比较喜 ...

  5. uni-app开发经验分享二十: 微信小程序 授权登录 获取详细信息 获取手机号

    授权页面 因为微信小程序提供的 权限弹窗 只能通用户确认授权 所以可以 写一个授权页面,让用户点击 来获取用户相关信息 然后再配合后台就可以完成登录 <button class="bt ...

  6. uni-app 微信小程序授权登录

    1.微信小程序 获取用户信息 与获取手机号 详细信息看官方公告:https://developers.weixin.qq.com/community/develop/doc/000cacfa20ce8 ...

  7. 微信小程序授权登录将open_id传至后台并入库

    要求能把用户昵称.头像以及open_id写入数据库,服务端保持用户登录状态 wxml: <block wx:else> <button type="primary" ...

  8. 微信小程序 - 授权页面

    小程序授权方式更改以后,我们只有两种选择. 1.在主页使用遮罩层,类似这样的(会造成一点卡顿) 2.新增登陆授权页(经过反复的思考,我还是觉得用这个好) 这个也不错: https://blog.csd ...

  9. 微信小程序授权获取手机号

    wxml: <text>pages/logins/logins.wxml</text> // <button open-type="getPhoneNumber ...

  10. 微信小程序入门教程之二:页面样式

    这个系列的上一篇教程,教大家写了一个最简单的 Hello world 微信小程序. 但是,那只是一个裸页面,并不好看.今天接着往下讲,如何为这个页面添加样式,使它看上去更美观,教大家写出实际可以使用的 ...

随机推荐

  1. tdlib成功编译版本20230205(java)

    tdjni是java本地调用接口dll文件夹下的三个动态链接是供tdjni调用的使用时这三个加到系统环境变量里 编译文件在本人的文件里,可以下载

  2. FPGA MIG调试bug(一)

    目标器件:复旦微FPGA:JFM7K325T8FCBGA676(对标Xilinx Kintex-7系的XC7K325T) 工程背景:板载4片DDR(AllianceMemory_DDR3L_8G_AS ...

  3. HTTP知识点

    HTTP 请求/响应的步骤:(工作原理) 客户端连接到 Web 服务器 一个 HTTP 客户端,通常是浏览器,与 Web 服务器的 HTTP 端口(默认为 80)建立一个 TCP 套接字连接.例如,h ...

  4. vim自动输入P的问题

    最近新租的centos8云服务器默认用的vim8.0,发现一个bug,就是每次打开文件,自动输入了一个P,原来是8.0的一个bug,升级版本可以解决 参考https://www.jianshu.com ...

  5. pycharm 连接服务器进行操作比 Xshell 更简单!

    一.SSH 连接 pycharm 中通过 SSH 连接服务器非常的简单,只需要简单的几步操作就能完成,如下图 1.第一步:点击开启 SSH 会话 2.第二步:填入对应的连接信息,点击 OK 3.这个时 ...

  6. tensorrt cuda cudnn 各版本的匹配要求

    https://docs.nvidia.com/deeplearning/tensorrt/release-notes/tensorrt-8.html#rel_8-0-3

  7. 再识redis-2

    Redis初识 特点关键字: 高性能Key-Value服务器 ops能达到十万级别 每秒能执行约11万集合 每秒约81000-条记录 主要数据结构 列表 集合 有序集合 散列(别名哈希 Redis的哈 ...

  8. 微积分 I 笔记

    1.1 集合 这一节复习了高中关于集合的基础知识 介绍了一些新的概念 笛卡尔积 (Cartesian Product) 集合 \(X\) 与 \(Y\) 的笛卡尔积 (直积) \(X \times Y ...

  9. 下载接口时出现:Try to run this command from the system terminal. Make sure that you use the correct version of 'pip' installed for your Python interpreter located at 'D:\python\demo\venv\Scripts\...的错误

    下载接口时出现:Try to run this command from the system terminal. Make sure that you use the correct version ...

  10. python 小顶堆

    from heapq import *heap=[]for i in range(10,1,-1): heappush(heap,i)print(heap)print(heappop(heap))pr ...