美食 健康 常识 生活 日常 合同 家居 养生 国学 心理学 中医 植物 营销 动物 汽车 管理 旅游 投资 人工智能 数字化 消费 元宇宙 金融 饮食 史学 经济
  • 会员

  • H5调起微信授权

    一、通过连接调起授权后重定向至页面

    window.location.href =
                    'https://open.weixin.qq.com/connect/oauth2/authorize?		
    				appid=wxXXXXXXXXXXXX 小程序appid 
    				&redirect_uri=http://XXX.com 重定向至当前页面
    				&response_type=code
    				&scope=snsapi_userinfo //用户手动授权
    				&state=#wechat_redirect'

    二、微信云托管登陆

    const wechatAppId = process.env.VUE_APP_WECHAT_APPID_MK;
    const wechatResourceId = process.env.VUE_APP_WECHAT_RESOURCE_ID;
    const wechatEnvId = process.env.VUE_APP_WECHAT_ENV_ID;
     
    // 微信云托管登录 换取用户信息 
    window.mplogin2.checkCloud({
        appid: wechatAppId,               // 必填,公众号appid,将以此appid名义进行请求
        resourceAppid: wechatAppId,       // 必填,如果是资源复用模式,需要填环境共享下资源方微信账号
        envid: wechatResourceId,                  // 必填,资源方微信云托管环境,如果传递此参数则会返回初始化的cloud操作对象
        signature: window.location.href,       // 选填,如果需要微信SDK的API方法,则填写要使用的地址,会返回signature签名对象,envid参数不填则无效。
        // region: ''                             // 选填,环境的地域,可选ap-guangzhou、ap-beijing,不填默认为ap-shanghai
        traceUser: false                        // 选填,默认true,是否在将用户访问记录到用户管理中,非上海地域请设置成false
    }).then(res => {
        if (res.login === true) {
            if (res.cloud != null) {
                // 挂载全局函数
                window.app = res.cloud;
                // 开始业务
                window.flag = true
                console.log('用于操作的CLOUD对象', res.cloud)
                console.log('微信用户信息', res.info)
     
                const getWechatUserInfo = function () {
                    return new Promise((resolve, reject) => {
                        let wx_userInfo, userInfo // {cloud_id, json}
                        try {
                            wx_userInfo = JSON.parse(localStorage.getItem('wx_userInfo'))
                            userInfo = JSON.parse(localStorage.getItem('userInfo'))
                        } catch (error) {
                            // 如果解析失败,证明未授权成功,需要重新授权
                        }
     
                        if (wx_userInfo && userInfo) {
                            resolve()
                        } else {
                            window.app.callContainer({
                                path: '/api/user/info',     // 填入业务自定义路径和参数,根目录,就是 / '/api/user/info', 
                                method: 'POST',                     // 按照自己的业务开发,选择对应的方法
                                header: {
                                    'X-WX-SERVICE': wechatEnvId,            // xxx中填入服务名称(微信云托管 - 服务管理 - 服务列表 - 服务名称)
                                },
                                data: {
                                    info: window.app.CloudID(res.info)
                                }
                                // 其余参数同 wx.request
                            }).then(res => {
                                return res.data.data_list[0]
                            }).then(userInfo => {
                                // {cloud_id, json}
                                localStorage.setItem('wx_userInfo', JSON.stringify(userInfo));
     
                                let openid, nickname, headimgurl, unionid, activity_id
                                try {
                                    const json = JSON.parse(userInfo.json);
                                    const data = json.data
                                    const data2 = JSON.parse(localStorage.getItem('activity_id'))
                                    activity_id = data2
                                    openid = data.openId
                                    nickname = data.nickName
                                    unionid = data.unionId
                                    headimgurl = data.avatarUrl
                                } catch (e) {
                                    // 错误上报
                                }
     
                               
                                } else {
                                    resolve()
                                }
                            })
                        }
                    })
     
                };
     
                // 获取用户信息
                // getWechatUserInfo();
     
                // 监听签名注册成功
                wx.ready(() => {
                    getWechatUserInfo().then(() => {
                        next()
                    })
                })
     
                // 使用微信公众号SDK,开始签名,签名信息在result.signature中
                // 发起签名注册,是一个异步操作,成功会触发wx.ready
                wx.config({
                    appId: wechatAppId, // 微信公众号appid
                    timestamp: res.signature.timestamp + '',   // 时间戳,从返回result.signature中获取
                    nonceStr: res.signature.nonceStr,          // 随机字符串,从返回result.signature中获取
                    signature: res.signature.signature,        // 签名,从返回result.signature中获取
                    jsApiList: [],                // 注册的api列表
                    openTagList: ['wx-open-launch-weapp'] // 可选,需要使用的开放标签列表,例如['wx-open-launch-app']
                })
            } else {
                // 登录成功,但环境加载失败,需按照提示解决
                console.log(res.msg)
            }
        } else {
            // 没有登录,需跳转到登录页面
            // 以下方式可以适应IOS、安卓、PC平台的跳转和返回
            //   const a = document.createElement("a");
            //   a.href = './login.html' // 需要和登录页保持一致
            //   a.click()
            window.mplogin2.doLogin({
                appid: wechatAppId,                   // 必填,公众号appid,将以此appid名义进行请求
                scope: 'snsapi_userinfo',                     // 必填,登录方式:snsapi_userinfo、snsapi_base// 必填,登录方式:snsapi_userinfo、snsapi_base
                // noback: true,                              // 选填,登录完不直接返回业务页面,执行自定义附加操作
                // redirect: window.location.href             // 跳转的页面,默认是当前页面,如果你有自定义登录成功页,可以联动设置 
            }).then(res => {
                // noback为true时,将不会返回业务页面,执行到这里
                // 此时需要自行控制跳转回业务页面
                console.log(res)
                next();
            })
        }
    })
    H5调起微信授权
    微信扫码分享

    0

    0

    分享
  • 会员

  • 上一篇: HTTP权威指南PDF版

    下一篇: wx-open-launch-weapp开放标签的使用

    还没有评论,赶紧来抢沙发吧!

    情人之间,有这些感觉可能越界了

    情人之间,感情是需要用心经营的。 然而,在感情的长河中,有一些感觉可能会越界,使关系走向尴尬和疲惫。 那么,我们应该如何 …

    南瓜是热性还是凉性(小米是热性还是凉性)

    从中医的角度来说,食物也是跟人一样是有五性的,而南瓜是生活中很常见的蔬菜,是什么属性的呢?是热性还是凉性? 南瓜是热性还 …

    霜降怎么养生更好

    霜降怎么养生更好 运动调神 霜降节气天气比较寒冷,此时人们的情绪会低落。比较好的’改善方法,就是大家应该要根 …

    内心强的人身上的特征,看看你占了几个?

    内心强大的人在面对生活的挑战和困难时,总是能够以坚定的态度和强大的意志力应对。他们身上有六个特征,这些特征让他们在逆境中 …

    低情商的人,最爱在微信上说这4种话,希望你没有

    微信,作为现代社交网络的重要平台之一,已经成为人们日常生活中不可或缺的一部分。 然而,随着社交媒体的普及,我们也逐渐发现 …

    汤油太多了怎么去除 汤油太多了怎么去除掉

    鸡肉,排骨一类的食材用来炖汤喝是十分有营养的,但是很多时候,熬出来的汤上油脂太多,喝起来就感觉很腻,那么汤油太多了怎么去 …

    莲雾和什么一起吃好(莲雾和什么一起吃最好)

    莲雾又叫水石榴,是一种热带水果,吃莲雾可以很好的补充碳水化合物,葡萄糖等营养成分,有益大脑健康,那么莲雾和什么一起吃好呢 …

    铁婚是结婚多少年

    铁婚是结婚六年的意思,因为铁属于活泼金属,在空气中的时间越长,越容易氧化生锈,从而出现腐蚀的现象,就像是刚结婚的夫妻,在 …

    米饭能放冰箱吗

    米饭能放冰箱  当天吃不完的米饭可以放在冰箱,不影响第二天再次食用,但不可存放太久,冷藏米饭最多存放两天,且食用前需充分 …

    无纺布墙纸怎么样

    无纺布墙纸怎么样 一、无纺布墙纸怎么样——从优点来看 在实际使用过程中,无纺布墙纸因为硬度以及密度的问题,所以不容易受潮 …

    大红豆的热量 大红豆的热量是多少

    大红豆是生活中常见的一种食材,营养丰富,很多人喜欢吃,但对减肥的人来说,需要控制食物热量,那么大红豆的热量是多少呢? 大 …

    情商低的人,通常有的表现,看你占了吗

    有人说:“智商高呢,是让自己高兴;情商高呢,是让别人高兴;智商不高情商也不高呢,就是自己不高兴了还不让别人高兴。” 一个 …

    创伤性应激障碍可以试试这5种方法

    创伤性应激障碍也是一种常见的心理疾病,事发的场景和负面情绪会不断的重复,而且会以做梦非自愿的痛苦记忆形式表达出来,而且还 …

    吃芒果有什么好处(吃芒果有什么好处和坏处)

    芒果是常见的热带水果之一,它的口感美味,其中还含有丰富的营养物质,如蛋白质、维生素C、维生素A、膳食纤维、多种矿物质等。 …

    2022小雪节气的饮食风俗

    2022小雪节气的饮食风俗有哪些你知道吗? 小雪节气的饮食风俗 腌腊肉 小雪后气温急剧下降,天气变得干燥,是加工腊肉的好 …

    人类有可能逃避死亡吗?如果生命能“永生”,地球可能随时崩溃

    没人希望自己变老,尽管人类为逃避死亡的过程作出了不少努力——从千年前熬炼的丹药到现在的各类补品,但死亡似乎是生活中不可避 …

    吃完螺蛳粉怎么去味道(屋里吃完螺蛳粉怎么去味道)

    螺蛳粉是一种味道有些臭的粉,而并没有因为这股臭味而降低人们对它的喜爱,而每次吃完螺丝粉都有味道,那么怎么去除味道呢?螺蛳 …

    大暑时节养生粥做法

    大暑是农历二十四节气中的第十二个节气,此时太阳到达黄经120度。在大暑这一天,大家一定要做好防暑工作,少在室外活动,不然 …

    西葫芦鸡蛋饼的做法(西葫芦鸡蛋饼的做法与视频)

    1、西葫芦1个、胡萝卜1/3根、鸡蛋2个、小葱2根、牛奶40毫升、玉米淀粉80克、食盐1克、花生油少许。 2、鸡蛋打散, …

    瘦腿霜怎么用效果最好

    一、使用瘦腿膏时,先清洁腿部,再擦干腿部,准备好瘦腿膏和保鲜膜。 二、将瘦腿膏自下而上均匀涂抹在腿上,摊开,在小腿肌肉和 …