uniapp H5微信公众号跳转小程序

第一次记录开发，话不多的说！

1.引微信js-sdk

npm install wx-module --save 
           

备注：npm安装自行百度

2.在需要调用的页面中引入

import wx from 'jweixin-module'
           

3.获取wx.config注册信息。注册成功提示config:ok ，上线需修改debug: false。

 let url = window.location.href.split('#')[0];//要在公众号平台设置JS接口安全域名，ip白名单
  uni.request({
      url: "http://www"+ '/api/wechat/get_wxSignature',//为了安全在自己后台拿到下面参数
      method: 'POST',
      data: {
         url: url
      },
      header: {
        'content-type': 'application/x-www-form-urlencoded'
      },
      success: data => {
          wx.config({
              debug: true, // 开启调试模式,返回值会在客户端alert出来。
              appId: "", // 必填，公众号的唯一标识
              imestamp: "", // 必填，生成签名的时间戳
              nonceStr: "", // 必填，生成签名的随机串
              signature: "", // 必填，签名
              jsApiList: ['onMenuShareTimeline'], // 必填，需要使用的JS接口列表
              openTagList: [ 'wx-open-launch-weapp'] // 可选，需要使用的开放标签列表
          });
          wx.ready(function() {});
     }     
   });
           

其中： signature签名参考

https://developers.weixin.qq.com/doc/offiaccount/OA_Web_Apps/JS-SDK.html#62

4.视图层调用

<wx-open-launch-weapp
    id="launch-btn"
    username="gh_a******", // 小程序的原始id
    path="****" // 需要跳转的小程序页面地址，不填会跳首页,必须.html结尾
>
  <script type="text/wxtag-template">
      <style>
        .btn-weapp {
          width: 180px; 
          height: 49px;
         }
      </style>
        <button class="btn-weapp">点击跳转小程序</button>
  </script>
</wx-open-launch-weapp>
           

说明：必须要在如下标签下，否则就算wx.config注册注册成功，也不会显示点击按钮，切记！！

 <script type="text/wxtag-template">
    <style>   
       //在这里实现点击页面
    </style>
 </script>
           

5.完美成功界面

6 如何查看小程序的AppID和原始ID，这里拿美团举例说明

 分享结束，欢迎指正！！！！