• 设为首页
  • 点击收藏
  • 手机版
    手机扫一扫访问
    迪恩网络手机版
  • 关注官方公众号
    微信扫一扫关注
    公众号

小程序wx-open-launch-weapp不显示按钮!

原作者: [db:作者] 来自: [db:来源] 收藏 邀请

直接说原因:微信开发者工具不能让其显示按钮! 请部署到服务器,直接使用手机测试!

请部署到服务器,直接使用手机测试!

请部署到服务器,直接使用手机测试!

请部署到服务器,直接使用手机测试!

重要的坑说三遍!

附上demo源码 大家可以直接参考

在开发工具里可以测试签名是否成功,成功后再到手机上测试查看按钮是否显示

<!DOCTYPE html>
<html lang="en">
    <head>
        <meta charset="UTF-8" />
        <meta name="viewport" content="width=device-width, initial-scale=1.0" />
        <title>跳转小程序</title>
    </head>
    <script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
    <body>
        <div>为啥按钮不显示?</div>
        <div>
            <wx-open-launch-weapp
                
                username="gh_xxxxxxxx"
                path="/pages/index/index.html"
            >
                <template>
                    <style>
                        .btn {
                            padding: 12px;
                            width: 100%;
                            height: 50px;
                        }
                    </style>
                    <button class="btn">打开小程序</button>
                </template>
            </wx-open-launch-weapp>
        </div>
        <script>
            // 封装 ajax
            const getSdkPromission= () => {
                return new Promise((resolve, reject) => {
                    var data = "";
                    var xhr = new XMLHttpRequest();
                    xhr.withCredentials = false;
                    xhr.addEventListener("readystatechange", function() {
                        if (this.readyState === 4) {
                            resolve(JSON.parse(this.responseText));
                        }
                    });
                    xhr.open(
                        "GET",
                        "/wx/sdk?url=" + window.location.href.split("#")[0]
                    );
                    xhr.setRequestHeader("Accept", "application/json");
                    xhr.send(data);
                });
            };
            window.onload = function() {
                console.log("onload");
                getSdkPromission().then(res => {
                    const conf = {
                        appId: "wx124b9xxxxxxxxx74",
                        debug: true,
                        nonceStr: res.noncestr,
                        signature: res.signature,
                        timestamp: res.timestamp,
                        jsApiList: ["getLocation"], 
                        openTagList: ["wx-open-launch-weapp"] //必须必须要不调用小程序标签渲染不出来
                    };
                    wx.config(conf);
                    //=== 获取 config 的参数以及签名=== end
                    wx.ready(function() {
                        // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中
                        console.log("wx ready");
                    });

                    wx.error(function(res) {
                        // config信息验证后会执行ready方法,所有接口调用都必须在config接口获得结果之后,config是一个客户端的异步操作,所以如果需要在页面加载时就调用相关接口,则须把相关接口放在ready函数中调用来确保正确执行。对于用户触发时才调用的接口,则可以直接调用,不需要放在ready函数中
                        console.log("res", res);
                    });

                    var btn = document.getElementById("launch-btn");
                    btn.addEventListener("launch", function(e) {
                        console.log("success");
                    });
                    btn.addEventListener("error", function(e) {
                        console.log("fail", e.detail);
                    });
                });
            };
        </script>
    </body>
</html>

微信不讲武德!微信sdk1.6, 签名,脚本加载,我全防出去了,你就让《微信开发工具》 来!骗!来!偷袭!我这个68岁的老同志!这好吗?这不好,我劝这位年轻人好自为之,好好反思,以后不要再犯这样的聪明,小聪明,武林要以和为贵,要讲武德,不要搞窝里斗!


鲜花

握手

雷人

路过

鸡蛋
该文章已有0人参与评论

请发表评论

全部评论

专题导读
热门推荐
阅读排行榜

扫描微信二维码

查看手机版网站

随时了解更新最新资讯

139-2527-9053

在线客服(服务时间 9:00~18:00)

在线QQ客服
地址:深圳市南山区西丽大学城创智工业园
电邮:jeky_zhao#qq.com
移动电话:139-2527-9053

Powered by 互联科技 X3.4© 2001-2213 极客世界.|Sitemap