原文鏈接https://blog.csdn.net/zxg_1991/article/details/79918100

1 微信小程序模板消息說明

• 基于微信的通知渠道残炮，我們?yōu)殚_發(fā)者提供了可以高效觸達(dá)用戶的模板消息能力呛每，以便實(shí)現(xiàn)服務(wù)的閉環(huán)并提供更佳的體驗(yàn)。
• 模板推送位置：服務(wù)通知
• 模板下發(fā)條件：用戶本人在微信體系內(nèi)與頁面有交互行為后觸發(fā)翘县，詳見下發(fā)條件說明
• 模板跳轉(zhuǎn)能力：點(diǎn)擊查看詳情僅能跳轉(zhuǎn)下發(fā)模板的該帳號(hào)的各個(gè)頁面
  以上是微信小程序開發(fā)文檔介紹，詳細(xì)資料可以打開查看谴分。下面的手機(jī)截圖顯示的是模板消息炼蹦，在微信的服務(wù)通知顯示我們定義的內(nèi)容，當(dāng)前圖片是麥當(dāng)勞的服務(wù)通知截圖狸剃。
  
  image

2 發(fā)送模板消息代碼

直接上一段發(fā)送模板消息的代碼掐隐，后臺(tái)服務(wù)是nodejs寫的。

function sendTemplateMessage(param) {
  return new Promise((resolve, reject) => {
    let opts = {
      touser: param.openId,
      template_id: param.template_id,
      form_id: param.formId,
      data: {
        "keyword1": {
          "value": param.user,
          "color": "#1d1d1d"
        },
        "keyword2": {
          "value": param.result,
          "color": "#1d1d1d"
        },
        "keyword3": {
          "value": param.time,
          "color": "#1d1d1d"
        }
      }
    }
    let data = {
      method: 'POST',
      url: `https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=${param.accessToken}`,
      body: JSON.stringify(opts),
      header: {
        'content-type': 'application/json' // 默認(rèn)值
      }
    }
    url.post(data).then(result => {
      result = JSON.parse(result)
      if (result.errcode == '0' && result.errmsg === 'ok') {
        resolve(result)
      }
      else {
        reject(result)
      }
    }).catch(err => {
      reject(err)
    })
  })
}

函數(shù)返回promise對(duì)象钞馁，參數(shù)param實(shí)現(xiàn)了全部的發(fā)送模板消息需要的參數(shù)虑省。

3 發(fā)送模板消息接口參數(shù)

通過官方文檔我們可以看到必要的參數(shù)有：

• touser训措，接收者的openid伪节，用來識(shí)別接收消息。
• template_id绩鸣，是在小程序模板消息的個(gè)人模板庫(kù)中定義模板消息的id怀大。
• form_id，這個(gè)是小程序界面表單提交場(chǎng)景下呀闻，為 submit 事件帶上的 formId化借；支付場(chǎng)景下，為本次支付的 prepay_id捡多。這里主要說明form_id,prepay_id如果你做了微信支付接口蓖康，就會(huì)了解铐炫。
• data模板內(nèi)容，如下代碼蒜焊，定義了3行數(shù)據(jù)倒信。

data: {
        "keyword1": {
          "value": param.user,
          "color": "#1d1d1d"
        },
        "keyword2": {
          "value": param.result,
          "color": "#1d1d1d"
        },
        "keyword3": {
          "value": param.time,
          "color": "#1d1d1d"
        }
      }

4 表達(dá)提交場(chǎng)景下的form_id

小程序界面組件使用form時(shí)，添加report-submit='true'屬性泳梆，在bindsubmit回調(diào)里會(huì)出現(xiàn)form_id鳖悠，所以你需要將form_id上傳到后臺(tái)發(fā)送模板消息的地方來使用，注意一個(gè)用戶對(duì)應(yīng)的form_id只能為該用戶推送模板消息鸭丛，不能為其他用戶使用竞穷，也就是說form_id是和openid綁定使用的，并且有效期是7天鳞溉。下面是一個(gè)簡(jiǎn)單的登錄界面瘾带。

<view class="login-body">
  <form class="form" bindsubmit="formSubmit" report-submit='true'>
    <view class="section">
      <text class='title-text1'>歡迎使用</text>
    </view>
    <view class="section">
      <text class='title-text2'>{{title}}</text>
    </view>
    <view class="section">
      <text class='content-text'>帳號(hào) : </text>
      <input class='input' name="username" type="text" />
    </view>
    <view class="section">
      <text class='content-text'>密碼 : </text>
      <input class='input' name="password" password type="text" />
    </view>
    <view class='section'>
      <button type='primary' form-type='submit'>登錄</button>
    </view>
  </form>
  <form class='section' bindsubmit="toRegister" report-submit='true'>
    <button type='default' form-type='submit'>注冊(cè)</button>
  </form>
</view>

formSubmit: function (e) {
// 顯示當(dāng)前formId
  console.log(e.detail.formId)
}

再次注意，在實(shí)際使用中熟菲，模擬器的formId: "the formId is a mock one"看政，只有真機(jī)下才會(huì)得到正確的formId。

5 無限次推送抄罕，打破微信接口限制

由于模板消息必須得到用戶的formId才可以為用戶推送消息允蚣，所以限制了為用戶推送的次數(shù)。所以我們可以預(yù)先收集用戶提交表單的formId呆贿，在需要推送表單的地方使用嚷兔。
前端提交用戶formId和openid數(shù)據(jù)，后臺(tái)保存到服務(wù)器中做入，注意formId的有效期是7天冒晰，這樣就可以達(dá)到偽無限次推送，打破微信接口的限制竟块。

formSubmit: function (e) {
    util.unloadFormId(e.detail.formId, app.globalData.openId)
}