收藏
回答

h5页面配置跳转小程序按钮:<wx-open-launch-weapp> 配置的按钮不显示?

环境条件

微信版本为:7.0.18。 苹果系统版本为:iOS 13.6,已经将该页面对应的域名加入到JS接口安全域名中,且下载了授权文件到对应的目录中。


页面代码

<!doctype html>
<html>
  <head>
		<meta charset="utf-8">
		<title>唤起小程序</title>
		<meta name="viewport" content="width=device-width,initial-scale=1,minimum-scale=1,maximum-scale=1,user-scalable=no" />
	 <script src="js/jquery-1.7.2.min.js"></script>
		<script src="https://res.wx.qq.com/open/js/jweixin-1.6.0.js"></script>
	</head>

	<body style="background-color:#F0F0CF">
	<div>
	 
	</div>
	<!-- 代码部分begin -->
	    <wx-open-launch-weapp id="launch-btn" username="gh_12345678" path="pages/index/index.html">    							
			<template>
			<style>.btn { padding: 12px }</style>
			<button class="btn">打开小程序</button>
			</template>
    </wx-open-launch-weapp>
 </body>
	
	<script type="text/javascript">
	 /**
 * 初始化微信js-sdk
 */

    $.ajax({
        url:  base_url,
        type: "get",
        beforeSend: function (request) {
            request.setRequestHeader("Authorization","eeeyJhbGciOiJIUzUxMiJ9.eyJzdWIiOiIiLCJleHAiOjE2MDU5Mzc1NjN9.YP39q5Ox5Tl_ka4Z_sVQwVbYDJztnynSWtV_HwmbqmmsEZMWSGuFs-psFpNsmRuZ7HJsieD_a1A9NWgracqPoQ");
        },
        success: function (result) {
            wx.config({
                 debug: true,
                // 必填,公众号的唯一标识
                appId: result.appId,
                // 必填,生成签名的时间戳
                timestamp: result.timestamp,
                // 必填,生成签名的随机串
                nonceStr: result.nonceStr,
                // 必填,签名,见附录1
                signature: result.signature,
                // 必填,需要使用的JS接口列表,所有JS接口列表见附录2
                jsApiList: ['checkJsApi', 'scanQRCode', 'closeWindow','hideOptionMenu','hideMenuItems','hideAllNonBaseMenuItem'],
			openTagList: ['wx-open-launch-weapp']
            });
        }, error: function (e) {
            mui.alert("程序有误,请联系系统管理员")
        }
    });

    wx.error(function (res) {
        alert("出错了:" + res.errMsg+","+JSON.stringify(res)); //这个地方的好处就是wx.config配置错误,会弹出窗口哪里错误,然后根据微信文档查询即可。
    });
    wx.ready(function () {
        wx.checkJsApi({
            jsApiList: ['scanQRCode', 'closeWindow','hideOptionMenu', 'hideMenuItems','hideAllNonBaseMenuItem'],
            success: function (res) {
                wx.hideOptionMenu();
           
            },
            error: function (res) {
                mui.alert(res);
            }
        });


    }) 
var btn = document.getElementById('launch-btn');
  btn.addEventListener('launch', function (e) {
   alert('success');
  });
  btn.addEventListener('error', function (e) {
   alert('fail', JSON.stringify(e));
  });
  btn.addEventListener('ready', function (e) {
   alert('ready', JSON.stringify(e));
  });
	</script>
</html>



运行效果

提示验证没有问题

示例页面链接地址:http://sso.wtbu.cn

问题

1 没有出现打开小程序的按钮,是我理解错了么?不能在微信中打开h5页面中的小程序? 如果理解没有问题,为什么按钮没有出来,是哪里配置错误了吗?

2 企业号中挂的h5页面是否也可以这样配置然后打开小程序?

非常感谢回复。

回答关注问题邀请回答
收藏

1 个回答

登录 后发表内容
问题标签