微信小程序授权页面,进入小程序如果没授权跳转到授权页面,授权后跳转到首页,如果用户点拒绝下次进入小程序还是能跳转到授权页面,授权页面如下

app.js  中的 onLaunch或onShow中加如下代码,如果没授权跳转到授权页面

    // 获取用户信息
wx.getSetting({
success: res => {
if (res.authSetting['scope.userInfo']) {
// 已经授权,可以直接调用 getUserInfo 获取头像昵称,不会弹框
wx.getUserInfo({
success: res => {
// 可以将 res 发送给后台解码出 unionId
this.globalData.userInfo = res.userInfo // 由于 getUserInfo 是网络请求,可能会在 Page.onLoad 之后才返回
// 所以此处加入 callback 以防止这种情况
if (this.userInfoReadyCallback) {
this.userInfoReadyCallback(res)
}
}
})
}else{
// 未授权,跳转到授权页面
wx.reLaunch({
url: '/pages/auth/auth',
})
}
}
})

auth.wxml 授权页面结构

<view class="auth">
<image src="https://res.wx.qq.com/wxopenres/htmledition/images/favicon32f740.ico" class="img" mode="aspectFill"></image>
<view class="title">微信授权页面</view>
<view class="describe">此页面是微信授权页面,点击下方按钮弹出授权或跳转页面</view>
<button class="btn" open-type='getUserInfo' wx:if="{{canIUse}}" bindgetuserinfo='onAuth'>点击微信授权</button>
<navigator wx:if="{{!canIUse}}" class="btn" url="/pages/auth/auth" open-type="reLaunch" hover-class="other-navigator-hover">已经授权点击调转</navigator>
</view>

auth.wxss  授权页面样式

/* 开始 */
page {
height: 100%;
display: table;
} .auth {
margin-top: 0;
text-align: center;
display: table-cell;
flex-direction: column;
flex-wrap: wrap;
justify-content: center;
align-items: flex-start;
padding: 100rpx;
vertical-align: middle;
} .img {
border-radius: 50%;
border: 1px solid #fff;
background-color: #fff;
margin: 0 0 60rpx;
display: inline-block;
width: 200rpx;
height: 200rpx;
line-height: 0;
} .title {
display: inline-block;
width: 100%;
margin: 0 0 60rpx;
} .describe {
color: #a7aaa9;
font-size: 26rpx;
margin: 0 0 60rpx;
border-radius: 50%;
text-align: center;
display: inline-block;
width: 100%;
} .btn {
padding: 0 60rpx;
background-color: #19be6b;
margin: 20rpx 0 200rpx;
text-align: center;
vertical-align: middle;
touch-action: manipulation;
cursor: pointer;
background-image: none;
white-space: nowrap;
user-select: none;
font-size: 14px;
border: 0 !important;
position: relative;
text-decoration: none;
height: 44px;
line-height: 44px;
box-shadow: inset 0 0 0 1px #19be6b;
background: #fff !important;
color: #19be6b !important;
display: inline-block;
border-radius: 10rpx;
}

auth.js  授权页面js,点击授权后跳转到首页

var app = getApp();
Page({
data: {
canIUse: wx.canIUse('button.open-type.getUserInfo')
},
onAuth() {
wx.getSetting({
success: (res) => {
if (res.authSetting['scope.userInfo']) {
wx.reLaunch({
url: '../index/index',
})
}
}
})
}
})

==============================================

本文链接 https://www.cnblogs.com/stumpx/p/9225323.html

==============================================

微信小程序button授权页面,用户拒绝后仍可再次授权的更多相关文章

  1. (十二)微信小程序实现登陆页面+登陆逻辑

    微信小程序实现登陆页面 实现上面两个页面 第一个页面 <view> <!-- 上侧部分 --> <view class="top-view"> ...

  2. Java Web项目,Android和微信小程序的初始页面配置

    Java Web项目 我们在Eclipse里开了Java Web项目之后,Run As Tomcat或者Apache服务器,本地运行,如果直接用http://localhost:8080访问项目,会发 ...

  3. 微信小程序开发之获取用户手机号码——使用简单php接口demo进行加密数据解密

    后边要做一个微信小程序,并要能获取用户微信绑定的手机号码.而小程序开发文档上边提供的获取手机号码的接口(getPhoneNumber())返回的是密文,需要服务器端进行解密,但是官方提供的开发文档一如 ...

  4. 逍遥云天 微信小程序开发之获取用户手机号码——使用简单php接口demo进行加密数据解密

    后边要做一个微信小程序,并要能获取用户微信绑定的手机号码.而小程序开发文档上边提供的获取手机号码的接口(getPhoneNumber())返回的是密文,需要服务器端进行解密,但是官方提供的开发文档一如 ...

  5. 微信小程序 button 组件

    button 组件 拥有强大的功能 自身可以拥有很多跟微信风格的样式,且是 表单 和 开放的能力 重要的 按钮 button 的属性: size: 类型 字符串 按钮的大小 属性值:default 默 ...

  6. 体验了微信小程序,发现安卓用户终于把果粉“碾压”了一次

    今天早上,张小龙在微信公开课上分享了小程序的理念,并且公布了小程序将于1月9日上线. 为了体现张小龙对未来程序形态的理解,小程序有四个特定:无需安装.触手可及.用完即走.无需卸载.今天,36氪刚好有机 ...

  7. 微信小程序——详细讲解页面传值(多种方法)

    1.使用navigator的url带参传值 (1)在pageA页面有一个固定的值要传递到pageB页面,比如说一个固定的值user_id要传递给B <navigator url=".. ...

  8. 微信小程序详解——页面之间的跳转方式【路由】和参数传递

    微信小程序拥有web网页和Application共同的特征,我们的页面都不是孤立存在的,而是通过和其他页面进行交互,来共同完成系统的功能.今天我们来研究小程序页面之间的跳转方式. 1.先导 在Andr ...

  9. 微信小程序开发系列五:微信小程序中如何响应用户输入事件

    微信小程序开发系列教程 微信小程序开发系列一:微信小程序的申请和开发环境的搭建 微信小程序开发系列二:微信小程序的视图设计 微信小程序开发系列三:微信小程序的调试方法 微信小程序开发系列四:微信小程序 ...

随机推荐

  1. Lnixu Bash

    一.简单命令 1.创建文件(vi) vi hellowold.txt2.创建目录(mkdir) mkdir linux_bash3.删除文件(rm) rm helloworld.txt4.复制文件(c ...

  2. OpenCV基本图像容器Mat的几种创建方法

    參考文章:http://www.cnblogs.com/tornadomeet/archive/2012/07/19/2599376.html 实验说明: (引用) 本文主要讲一些opencv 2.0 ...

  3. Tomcat最多支持并发多少用户?

    当一个进程有 500 个线程在跑的话,那性能已经是很低很低了.Tomcat 默认配置的最大请求数是 150,也就是说同时支持 150 个并发,当然了,也可以将其改大.当某个应用拥有 250 个以上并发 ...

  4. go 泛型 Go中不包含的特性

    人Andrei Alexandrescu:“Go所走的路线在一些问题上持有极其强硬和死板态度,这些问题有大有小.在比较大的方面,泛型编程被严格控制,甚至贬低到只有"N"个字:有关泛 ...

  5. C++明确规定,不能获取构造函数和析构函数的地址

    C++标准明确规定,不能获取构造函数和析构函数的地址,因此也无法形成指向他们的成员函数指针. 指向成员函数的指针可以,指向构造函数析构函数的不行.因为构造函数和析构函数都是没有返回值的,无法声明一个没 ...

  6. Servlet8

    一.Annotation 进行配置不需要 web.xml 新建new Servlet 时,不需要在web.xml 文件中生成Servlet的相关信息 import java.io.IOExceptio ...

  7. bzoj2743 [HEOI2012]采花——树状数组+离线

    题目:https://www.lydsy.com/JudgeOnline/problem.php?id=2743 和 HH的项链 那道题很像,也是类似的做法: 但不同的是这里的点只有有前驱时才起作用: ...

  8. CentOS6.0忘记root密码解决办法

    说明操作系统:CentOS 6.0遇到问题:忘记管理员账号root的密码,进不了系统解决办法:重置root密码为123456操作: 开机启动系统,在进入系统之前按键盘上面的Esc键,会进入下面的界面 ...

  9. shell 与 空格

    shell脚本中,不能随意添加空格,否则出错: 1,=等号两边必须无空格.否则出错.如i =$1和i= $1都是错的.但是在()内部不限制如for ((i= 1;i < 3;i= i+1))是正 ...

  10. 关于ArcGis for javascrept之FeatureLayer类与GraphicsLayer类

    FeatureLayer: ArcGIS for Server发布的要素服务或者地图服务中的图层 构造方法: myFeatureLayer = new esri.layers.FeatureLayer ...