微信公众号H5页面跳转小程序

最新推荐文章于 2024-06-18 17:23:03 发布

Las_wang

最新推荐文章于 2024-06-18 17:23:03 发布

阅读量1.5k

点赞数

分类专栏：微信开发文章标签： html

本文链接：https://blog.csdn.net/weixin_38576764/article/details/113242917

版权

微信开发专栏收录该内容

3 篇文章 0 订阅

订阅专栏

    <script src="../js/jquery-1.8.2.min.js"></script>
    <script src='http://res.wx.qq.com/open/js/jweixin-1.6.0.js'></script>

<body>
<div id="launch-btn">
</div>
</body>

微信签名

                wx.config({
                    // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
                    debug: false,
                    // 必填，公众号的唯一标识
                    appId: arr[0],
                    // 必填，生成签名的时间戳
                    timestamp: arr[2],
                    // 必填，生成签名的随机串
                    nonceStr: arr[1],
                    // 必填，签名
                    signature: arr[4],
                    // 必填，需要使用的JS接口列表
                    jsApiList: ["startRecord", "stopRecord", "onVoiceRecordEnd", "playVoice", "pauseVoice", "stopVoice", "onVoicePlayEnd", "uploadVoice", "downloadVoice", "chooseImage", "previewImage", "uploadImage", "downloadImage", "translateVoice", "getNetworkType", "openLocation", "getLocation"],
                    openTagList: ['wx-open-launch-weapp'] // 可选，需要使用的开放标签列表，例如['wx-open-launch-app']
                });

动态配置跳转链接

var btn = document.getElementById('launch-btn');
        var content = `<template><style>.btn { width:52%;padding: 12px;border:none;color:white;border-radius: 10px;height:60px;background-color: #639EFD;font-size: 18px;margin-top: 20pt}p{color:#999999;margin-top: 40pt}img{width: 50%;margin-top: 80pt}.content{margin: 0 auto;text-align: center}</style>
        <div class='content'>
        <img src='http://weixin.happy-ti.com/weixinpay/image/redirectQrcodeBg.png'>
        <p>点击跳转到xxxx</p>
        <button class='btn'>点击跳转</button>
        </div>
        </template>`;
        let script = document.createElement("script");// 创建script内容插槽 避免template标签冲突
        script.type = "text/wxtag-template"; // 使用script插槽 必须定义这个type
        script.text = content // 自定义的html字符串内容
        let html = "<wx-open-launch-weapp style='width:100%;display:block;' username='gh_xxxxxx' path=" + pageUrl + ">" + content + "</wx-open-launch-weapp>";
        btn.innerHTML = html; // html字符串赋值

        btn.addEventListener('launch', function (e) {
            console.log('success');
        });
        btn.addEventListener('error', function (e) {
            alert(e.detail)
        });

Las_wang

关注

0
点赞
踩
2

收藏

觉得还不错? 一键收藏
0
评论
微信公众号H5页面跳转小程序

<script src="../js/jquery-1.8.2.min.js"></script> <script src='http://res.wx.qq.com/open/js/jweixin-1.6.0.js'></script><body><div id="launch-btn"></div></body>微信签名 wx.config({ ...
复制链接

扫一扫

专栏目录