uni-app 登录

微信小程序登录

在manifest.json中的源码视图下找到mp-weixin下的appid,填写申请到的开发者id

 

"mp-weixin" : {
        "appid" : "xxxxxxxxxxxxxxx",
        "setting" : {
            "urlCheck" : false
        },
        "usingComponents" : true
    },

app.vue

<script>

    global.isLogin=function(){
        try{
            var suid=uni.getStorageSync('suid')
            //随机码
            var srand=uni.getStorageSync('srand')
        }catch(e){
            //TODO handle the exception
            console.log(111)
            console.log(e)
        }
        if(suid==='' || srand===''){
            return false
        }else{
            return [suid,srand]
        }
    }
    export default {
        onLaunch: function() {
            console.log('App Launch')
        },
        onShow: function() {
            console.log('App Show')
        },
        onHide: function() {
            console.log('App Hide')
        }
    }
</script>

<style>
    /*每个页面公共css */
    view{
        
    }
    page{
        
    }
</style>

login.vue

<template>
    <view>
            <button 
                type="primary" 
                open-type="getUserInfo" 
                @getuserinfo="getUserInfo"
                withCredentials="true"
            >微信登录</button>
            <button 
                type="default"
                open-type="getPhoneNumber"
                @bindgetphonenumber="getPhoneNumber"
            >
                手机登录
            </button>
            <!-- #ifdef APP-PLUS -->
            
            <!-- #endif -->
    </view>
</template>

<script>
    // withCredentials 是否带上登录信息
    // https://api.weixin.qq.com/sns/jscode2session?appid=APPID&secret=SECRET&js_code=JSCODE&grant_type=authorization_code
    //https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/login/auth.code2Session.html
    export default{
        onLoad() {
            uni.setNavigationBarTitle({
                title:'login'
            })
        },
        methods:{
            getPhoneNumber(res){
                console.log(res)
            },
            getUserInfo:(res)=>{
                console.log(res)
                //获取一些不加密的基本信息
                if(!res.detail.iv){
                    uni.showToast({
                        title:'您取消了授权,登录失败',
                        icon:'none'
                    })
                    return false
                }
                uni.login({
                    provider:'weixin',
                    //微信登录
                    success(loginRes) {
                        //会返回code session——key
                        //将登录返回的code传入获取openid 和 session_key
                        uni.request({
                            url:'https://hoa.hcoder.net/xcxencode/?c=sk&appid=wx9358b9a7385d9080&secret=39f6d86896344757dd5afbb4de2b3f05&code='+loginRes.code,
                            success: (res3) => {
                                //openid
                                //session_key
                                //解密
                                // 获取加密的东西
                                uni.request({
                                    method:'POST',
                                    url:'https://hoa.hcoder.net/xcxencode/',
                                    header:{'content-type':'application/x-www-form-urlencoded'},
                                    data:{
                                        appid:'wx9358b9a7385d9080',
                                        sessionKey:res3.data.session_key,
                                        iv:res.detail.iv,
                                        encryptedData:res.detail.encryptedData
                                    },
                                    success: (res4) => {
                                        console.log(res4)
                                    }
                                })
                            }
                        })
                    },
                    fail(r) {
                        console.log(r,222)
                    }
                })
            }
        }
    }
</script>

<style>
</style>

猜你喜欢

转载自www.cnblogs.com/lxz-blogs/p/12604957.html