收藏
回答

求助服务号H5无法拉起第三方小程序,wx-open-launch-weapp未正常显示?

按官方文档说明,wx-open-launch-weapp在真机微信上无法正常显示,求助!!

1.是企业认证的服务号

2.服务号对H5已完成绑定JS接口安全域名

3.已引入jweixin-1.6.0.js

4.wx.config初始化成功

5.wx.ready验证接口成功


以下是代码和界面,相关生产信息XXXXXX替换了。

<html>


<head>

  <title>H5打开小程序</title>

  <meta http-equiv="Content-Type" content="text/html; charset=utf-8">

  <meta name="viewport" content="width=device-width, user-scalable=no, initial-scale=1, maximum-scale=1">

  <script src="/xxxxxx/jweixin-1.6.0.js"></script>

  <script src="/xxxxxx/vconsole.min-3.15.1.js"></script>

  <script>

    var vConsole = new VConsole();

    console.log('vConsole初始化完成!');

  </script>

</head>


<body>

  <div style="position: relative;">

    <p>这里是按钮</p>

    <wx-open-launch-weapp id="launch-btn" username="gh_xxxxxx" path="/xxxxxx"

      style="position: relative; display: block; width: 240px; height: 60px;">

      <script type="text/wxtag-template">

        <style>

          .wx-btn{

            width: 100%;

            height: 100%;

            background-color: #1760ea;

            color: #ffffff;

            font-weight: 600;

            text-align: center;

            vertical-align: middle;

            border-radius: 4px;

          }

        </style>

        <button class="wx-btn">

          打开小程序

        </button>

      </script>

    </wx-open-launch-weapp>

  </div>


  <script type="text/javascript">

    (async () => {

      // 域名

      const domain = 'https://xxxxxx.xxxxxx.com.cn';


      // 监听

      var btn = document.getElementById('launch-btn');

      btn.addEventListener('launch', function (e) {

        console.log('success');

      });

      btn.addEventListener('error', function (e) {

        console.log('fail', e.detail);

      });


      // 测试接口

      const pUrl = window.location.href;

      const oaiaData = await fetch(domain + '/xxxxxx/api/public',

        {

          method: 'POST',

          headers: {

            'Content-Type': 'application/json',

            'app-platform': 'mini',

          },

          credentials: 'omit',

          body: JSON.stringify({

            "payload": { "xxxxxx@xxxxxx": { "url": pUrl } },

          }),

        },


      ).then(response => {

        if (!response.ok) {

          throw new Error('Network response was not ok');

        }


        return response.json()


      }).then(data => {

        console.log(`then >>>`, data);

        const keys = Object.keys(data);

        return keys.length > 0 ? data[keys[0]] : undefined;


      }).catch(error => {

        console.error('error:', error)

      });


      if (oaiaData) {

        console.log(`>>> 开始初始化...`);


        const ua = navigator.userAgent.toLowerCase();

        const isWeChatWeb = ua.indexOf('micromessenger') > -1;


        if (isWeChatWeb) {

          const { appId, timeStamp, nonceStr, signature } = oaiaData;


          wx.config({

            debug: true,

            appId: appId,

            timestamp: Number(timeStamp),

            nonceStr: nonceStr,

            signature: signature,

            jsApiList: ['closeWindow'],

            openTagList: ['wx-open-launch-weapp'],

          });


          wx.ready(() => {

            console.log('>>> 初始化成功');

          });


          wx.error((e) => {

            console.log('>>> 初始化失败', e.errMsg);

          });


        } else {

          alert("请在微信中打开");

        }


      } else {

        console.log(`>>> 未获取到微信sdk配置`);

      }

    })();

  </script>

</body>


</html>

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

3 个回答

  • 社区技术运营专员--许涛
    社区技术运营专员--许涛
    2025-12-04

    你好,控制台Debug打印下config参数和其他相关入参

    2025-12-04
    有用
    回复
  • 神经蛙
    神经蛙
    2025-12-25

    问题搞好了,请问,最后怎么解决的?

    2025-12-25
    有用
    回复
  • 智能回答 智能回答 本次回答由AI生成
    2025-12-04
    有用
    回复
登录 后发表内容