小程序-Wepy实现登录授权

1.app.wpy   授权检测如果已授权则进入首页,未授权则关闭所有页面进入应用中的授权页面

wx.reLaunch({
     url: '/pages/authorize/authorize',
})

2.授权页面 authorize.wepy代码

<template>
    <view wx:if="{{canIUse}}">
        <view class='header'>
            <image src='/images/logo.jpg'></image>
        </view>
        <view class='content'>
            <view>申请获取以下权限</view>
            <text>获得你的公开信息(昵称,头像等)</text>
        </view>
        <button class='bottom' type='primary' open-type="getUserInfo" lang="zh_CN" bindgetuserinfo="bindGetUserInfo">
            授权登录
        </button>
    </view>
    <view wx:else>请升级微信版本</view>
</template>

<script>
    import wepy from 'wepy'
    export default class Authorize extends wepy.page {
        config = {
            "navigationBarTitleText": "授权登录"
        };
        data = {
            //判断小程序的API,回调,参数,组件等是否在当前版本可用。
            canIUse: wx.canIUse('button.open-type.getUserInfo')
        };
        bindGetUserInfo(e) {
            if (e.detail.userInfo) {
                //用户按了允许授权按钮
                //插入登录的用户的相关信息到数据库

                //授权成功后,跳转进入小程序首页

            } else {
                //用户按了拒绝按钮
                wx.showModal({
                    title: '警告',
                    content: '您点击了拒绝授权,将无法进入小程序,请授权之后再进入!!!',
                    showCancel: false,
                    confirmText: '返回授权',
                    success: function (res) {
                        if (res.confirm) {
                            console.log('用户点击了“返回授权”')
                        }
                    }
                })
            }
        }
    }
</script>

<style lang="less">
    .header {
        margin: 90rpx 0 90rpx 50rpx;
        text-align: center;
        width: 650rpx;
        height: 300rpx;
        line-height: 450rpx;
    }
    .header image {
        width: 200rpx;
        height: 200rpx;
        border-radius: 100rpx;
    }
    .content {
        margin-left: 50rpx;
        margin-bottom: 90rpx;
    }
    .content text {
        display: block;
        color: #9d9d9d;
        margin-top: 40rpx;
    }
    .bottom {
        border-radius: 80rpx;
        margin: 70rpx 50rpx;
        font-size: 35rpx;
    }
</style>
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值