uniapp实现app跳转微信小程序然后跳回app

首先app页面代码如下:

html代码:

<view class="cash-info__item u-flex bg-white wx_logo_box" v-if="index==1">
                <view class="u-m-r-20 opid_box">openid:{{openid}}
                </view>
                <button class="logo_btn" @click="getWxEvent">获取收款微信</button>
            </view>


js部分代码:

const openid = ref(null);


    const getWxEvent = async () => {
        // //调用微信小程序
        plus.share.getServices(
            res => {
                let sweixin = null;
                for (let i in res) {
                    if (res[i].id == 'weixin') {
                        sweixin = res[i];
                    }
                }
                //唤醒微信小程序
                if (sweixin) {
                    sweixin.launchMiniProgram({
                        id: 'gh_xxxxxxxxx', //微信开放平台 --- 绑定的微信小程序的 --- 原始id,注意不是appid
                        type: 2, //小程序版本  0-正式版; 1-测试版; 2-体验版。
                        path: 'pages/subPublic/xcxopenid?id=1' //小程序的页面,用传的参数在小程序接值判断跳转指定页面,可以携带参数
                    });
                } else {
                    console.log("未安装微信逻辑")
                }
            }
        );
    }
//解下来这是用于小程序回调到app的代码,他是只能回到打开小程序的页面
const diyici = ref(0)
    onLoad((opt) => {
        getCashInfo()
        getService()
        diyici.value = 1 //从小程序返回时不会再走一次这onLoad,所以用来标识第一次加载
    })
    onShow(() => {
        inspectCompany();
        tixianchaxunApi();
        if (diyici.value == 1) {
            openid.value = userInfo.value.openid;
            diyici.value = 2
        } else {
            // #ifdef APP-PLUS
            openid.value = plus.runtime.arguments;  //小程序返回的参数
            proxy.$request(proxy.$api.changeInfo, {
                'openid': plus.runtime.arguments
            }).then((res) => {
                info.value.openid = plus.runtime.arguments
            })
            console.log('小程序返回参数', plus.runtime.arguments);
            // #endif
        }
    })

小程序的代码

html代码,只能放这个按钮,app-parameter为你要传递的参数,类型固定是launchApp,
如果是从别的场景跳转过来的是无法返回app的,比如通过短信外链,
别的小程序跳转过来的,会无法返回app

<button open-type="launchApp" style="margin-top: 50rpx;" class="phone-btn" :app-parameter="openid"
                    @error="launchAppError">返回APP</button>


js代码
launchAppError 点击事件,执行返回的日志,啥@click方法时没用的
const launchAppError = (e) => {
        console.log('false', e.detail.errMsg)
        tanchuan.value = false
    }

//获取app传来的参数
onLoad((opt) => {
        console.log('appt跳转携带的参数', opt);

    })

这样就实现效果了,如果不行看下是否在微信开放平台给app获取了跳转小程序的能力,一般是通过了审核的app就有这能力.

  • 11
    点赞
  • 10
    收藏
    觉得还不错? 一键收藏
  • 1
    评论
要在 H5 页面中跳转微信小程序,需要使用微信提供的 JS-SDK。 首先,在 H5 页面中引入微信 JS-SDK: ```html <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script> ``` 然后,在页面加载完成后,初始化 JS-SDK: ```javascript wx.config({ // 这里需要填写微信公众号的 appid appId: 'your_app_id', // 这里需要填写当前页面的完整 URL,不包括 # 及其后面部分 // 例如:http://www.example.com/path/to/page // 注意:JS-SDK 要求 URL 必须是经过encodeURIComponent编码的 // 所以需要使用 encodeURIComponent 方法进行编码 // 下面的示例假设当前页面的 URL 是 http://www.example.com/path/to/page#abc // 则需要编码的 URL 是 http%3A%2F%2Fwww.example.com%2Fpath%2Fto%2Fpage // 注意:如果当前页面的 URL 有参数,则需要把参数也编码进去 // 例如:http://www.example.com/path/to/page?foo=bar&baz=qux // 则需要编码的 URL 是 http%3A%2F%2Fwww.example.com%2Fpath%2Fto%2Fpage%3Ffoo%3Dbar%26baz%3Dqux // 如果不知道如何编码 URL,可以使用 encodeURIComponent 方法 // 例如:encodeURIComponent('http://www.example.com/path/to/page#abc') // 输出:http%3A%2F%2Fwww.example.com%2Fpath%2Fto%2Fpage%23abc // 可以使用浏览器的 Console 进行测试 // 注意:下面的示例中,URL 部分需要替换成实际的 URL // 示例中的 appid 和 URL 都是假的,请替换成实际的 appid 和 URL // 注意:wx.config 方法需要传入一个回调函数,用于在配置完成后执行 // 回调函数中的代码可以调用 wx.checkJsApi 方法检查当前环境是否支持 JS-SDK 的相关 API // 如果支持,则可以在回调函数中执行其他操作,例如打开微信小程序 // 如果不支持,则需要提示用户在微信客户端打开页面 jsApiList: ['checkJsApi'] // 这里需要填写微信公众号的 secret // 然后调用 wx.ready 方法,在回调函数中执行其他操作 // 例如打开微信小程序 }); ``` 最后,通过调用 wx.miniProgram.navigateTo 方法打开微信小程序: ```javascript wx.miniProgram.navigateTo({ // 这里需要填写要跳转的小程序的 appid 和页面路径 // 例如:appid: 'wx1234567890', path: 'pages/index/index' appid: 'your_mini_program_appid', path: 'your_mini_program_page_path' }); ``` 需要注意的是,以上代码仅适用于在微信浏览器中打开的 H5 页面。如果在其他浏览器中打开,或使用微信开发者工具预览,则无法跳转微信小程序

“相关推荐”对你有帮助么?

  • 非常没帮助
  • 没帮助
  • 一般
  • 有帮助
  • 非常有帮助
提交
评论 1
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

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

抵扣说明:

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

余额充值