H5跳小程序_h5跳小程序首页

<wx-open-launch-weapp
          id="launch-btn"
          username="gh_4xxxxxxxxxxx"
          path="pages/index/index.html"
        >
          <script type="text/wxtag-template">
            <style>.btn { padding: 0; background: #6512AE;font-size: 15px;color: #fff; border: none; }</style>
            <button class="btn">去小程序解锁更多权限</button>
          </script>
        </wx-open-launch-weapp>
1
2
3
4
5
6
7
8
9
10

this.getWxParam();
getWxParam() {
        let that = this;
		const pageUrl = window.location.href.split("#")[0];

		this.$http.get('后台接口', {
          params: {
            url: pageUrl
          },
        })
        .then((res) => {
          if (res.success) {
            const {
              appId,
              nonceStr,
              signature,
              timestamp
            } = res.data;
            wx.config({
              debug: false, // 开启调试模式,调用的所有api的返回值会在客户端alert出来，若要查看传入的参数，可以在pc端打开，参数信息会通过log打出，仅在pc端时才会打印。
              appId: appId, // 必填，公众号的唯一标识
              timestamp: timestamp, // 必填，生成签名的时间戳
              nonceStr: nonceStr, // 必填，生成签名的随机串
              signature: signature, // 必填，签名
              jsApiList: ["chooseWXPay", "showMenuItems"], // 必填，需要使用的JS接口列表
              openTagList: ['wx-open-launch-weapp']
            });
            wx.error(function(res) {
              // config信息验证失败会执行error函数，如签名过期导致验证失败，具体错误信息可以打开config的debug模式查看，也可以在返回的res参数中查看，对于SPA可以在这里更新签名。
              console.log('获取微信失败')
              that.$refs.uToast.show({
                title: res,
              });
            });
          }
        });
			},
1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37

记得引入微信的jssdk