zoukankan      html  css  js  c++  java
  • 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>
  • 相关阅读:
    基本数据类型的包装类(wrapper class)、自动的装箱和拆箱、时间处理相关类、Math类、File类、枚举类
    数组、String、Stringbuilder、StringBuffer
    Introduction into browser events
    Javascript join example by separator
    text-transform
    JQuery :Not() Selector Example
    jQuery html() example
    jQuery
    $("selector").slice(start, end)
    位置博弈
  • 原文地址:https://www.cnblogs.com/lxz-blogs/p/12604957.html
Copyright © 2011-2022 走看看