1. 微信后臺(tái)跳轉(zhuǎn)路徑使用帶有/#/的路徑跳轉(zhuǎn)失敗

發(fā)布使用history方式, 不要使用hash模式
發(fā)布history方式時(shí), 需要配置一下nginx的代理

    location / {
        root   /data/web/purchase/web/;
        index  index.html;
        try_files $uri $uri/ /index.html; # 增加此處的配置
    }

2. vue3 方式使用wx-open-subscribe標(biāo)簽問(wèn)題

因?yàn)閠emplate標(biāo)簽里面不支持直接寫script及style等標(biāo)簽, 需要使用v-is="'script'" 轉(zhuǎn)義一下

<wx-open-subscribe template="7K-5P74z4uq8KtyuyDjQR6NDeu7ghwTzsfMu2grcGes" id="subscribe-btn" class="default_btn">
  <div v-is="'script'" type="text/wxtag-template" slot="style">
    <div v-is="'style'">
      .subscribe-btn { display:flex;width:100%;background-color:#03a802;align-items:center;justify-content:center; color: #fff; font-weight: bold; border:none;
      height:40px;font-size:18px; border-radius:10px;}
    </div>
  </div>
  <div v-is="'script'" type="text/wxtag-template">
    <button class="subscribe-btn">
      訂閱消息
    </button>
  </div>
</wx-open-subscribe>

注意: 只有在wx-*標(biāo)簽內(nèi)定義的style才能對(duì)button起效果

3. 網(wǎng)頁(yè)上使用wx-* 標(biāo)簽的條件

需要引入<script type="text/javascript" src="https://res2.wx.qq.com/open/js/jweixin-1.6.0.js"></script> 文件
并且需要在初始化的時(shí)候調(diào)用wx.config進(jìn)行配置, 配置參數(shù)可通過(guò)接口調(diào)用后臺(tái)發(fā)揮的參數(shù)進(jìn)行拼接, 前臺(tái)最好不存儲(chǔ)敏感信息

注意:
后臺(tái)的url應(yīng)是當(dāng)前路徑的url, 可將此url傳給后臺(tái)進(jìn)行處理, 以免提示加密出錯(cuò)
只有配置成功了之后, wx-* 標(biāo)簽才會(huì)顯示

onMounted(() => {
  getJsApiConfig({url: window.location.href}).then(res => {
    wx.config({
      debug: false, // 開(kāi)啟調(diào)試模式,調(diào)用的所有api的返回值會(huì)在客戶端alert出來(lái)，若要查看傳入的參數(shù)，可以在pc端打開(kāi)，參數(shù)信息會(huì)通過(guò)log打出，僅在pc端時(shí)才會(huì)打印
      appId: res.appId, // 必填，公眾號(hào)的唯一標(biāo)識(shí)
      timestamp: res.timestamp, // 必填，生成簽名的時(shí)間戳
      nonceStr: res.nonceStr, // 必填，生成簽名的隨機(jī)串
      signature: res.signature,// 必填，簽名
      jsApiList: ['closeWindow'], // 必填，需要使用的JS接口列表
      openTagList: ['wx-open-subscribe'] // 可選，需要使用的開(kāi)放標(biāo)簽列表，例如['wx-open-launch-app']
    });
    wx.ready(() => {
      let btn = document.getElementById('subscribe-btn');
      btn.addEventListener('success', (e) => {
        showAlert("訂閱成功", "成功", () => {
          alertOption.show = false;
        });
      });
      btn.addEventListener('error', (e) => {
        showAlert("請(qǐng)訂閱推送消息, 以便在電費(fèi)不足時(shí)及時(shí)告知", "提示", () => {
          alertOption.show = false;
        });
      });
    })
  })
})