微信小程序實現訂閱信息功能

目錄

前言

流程分析

實現過程

 

---

前言

本文介紹使用訂閱信息API，來實現微信小程序的訂閱信息功能，集成在支付完成步驟上。

流程分析

 

上圖是從網上找到的最詳細的流程圖，從圖中可以分析出大概以下幾個流程：

1.用戶進入“設置--消息訂閱”，設置不接收消息時，則支付完成後直接跳轉頁面；

2.微信版本不支持訂閱信息方法時，則在支付完成後，輸出錯誤信息並跳轉頁面；

3.下發權限窗口中，不勾選“總是保持以上選擇，不再詢問”且點擊“允許”時，則支付完成後調用後臺接口下發訂閱消息；如果是多模板情況（最多三個模板），要根據各模板是否勾選判斷那個模板可以下發（模板未勾選時，雖然點擊了允許，但返回信息是“reject”））並跳轉頁面；

4.下發權限窗口中，不勾選“總是保持以上選擇，不再詢問”且點擊“取消”時，則支付完成後直接跳轉頁面，不下發訂閱信息；

5.下發權限窗口中，勾選“總是保持以上選擇，不再詢問”且點擊“允許”時，則支付完成後調用後臺接口下發訂閱消息；如果是多模板情況（最多三個模板），要根據各模板是否勾選判斷那個模板可以下發（模板未勾選時，雖然點擊了允許，但返回信息是“reject”））並跳轉頁面；而第二次支付完成後，不會彈出下發權限窗口，而是根據上次模板的信息進行下發（如想彈出窗口，可使用開發工具“清除緩存”）；

6.下發權限窗口中，勾選“總是保持以上選擇，不再詢問”且點擊“取消”時，則支付完成後直接跳轉頁面，不調用下發訂閱信息接口；而第二次支付完成後，不會彈出下發權限窗口，而是根據上次模板的信息不下發（如想彈出窗口，可使用開發工具“清除緩存”）；

實現過程

上圖爲各種情況的返回數據情況，分析上面的數據，有利於理解實現代碼的原理：

1.增加公共函數，用來調用訂閱信息的下發權限；

註釋：

　　1）wx.requestSubscribeMessage爲小程序提供的API，可點擊查看詳細說明；

　　2）that.data.subscriptionData.subscribe_templates存放模板的信息（1-3個），然後傳參給後臺接口config.sendTemplateMsg，config.sendTemplateMsg該後臺接口使用下發方法subscribeMessage.send（點擊查看詳細說明）；

　　3）在支付完成後，如果使用“wx.reLaunch”進行跳轉，會出現無法跳轉的問題，這是因爲跳轉到支付頁面後，導致原來的頁面找不到，所以這裏使用“wx.redirectTo”跳轉。

　　Tips：對於多模板，部分模板不是即時下發訂閱信息，可在調用config.sendTemplateMsg接口時 ，後臺先緩存必要的信息（oppid、訂單號、模板信息等），然後在小程序點擊相應場景再調用後臺接口下發相應的訂閱信息。

// 訂閱信息的下發授權
  subscribeMessage: function(templateId) {
    let that = this;
    try {
      wx.requestSubscribeMessage({
        tmplIds: templateId,
        success(res) {
          for (let key in res) {
            if (key !== "errMsg" && key !== "errorCode") {
              let obj = {
                template_id: key,
                status: res[key]
              };
              that.data.subscriptionData.subscribe_templates.push(obj);
            }
          }
          console.log(that.data.subscriptionData);
          // 訂閱信息接口
          util.requestUrl(config.sendTemplateMsg, that.data.subscriptionData).then((res) => {
            console.log('調用訂閱信息接口！');
          }).catch((errMsg) => {
            console.log(errMsg); //錯誤提示信息
          });
          wx.redirectTo({
            url: '../../pages/index/index'
          });
        },
        fail(res) {
          console.log(res);
        }
      })
    } catch (err) { // 當前微信版本不支持訂閱信息
      console.error("subscribeMessage-err", err);
    }
  }

2.支付完成後的操作 （只截取下發權限部分的代碼）；

註釋：

　　1）templateId數組的數據爲模板ID，可在微信公衆平臺手動配置獲取模板 ID；

　　Tips：templateId可調用後臺接口獲取，這樣就不用每次有改動就重新修改小程序進行審覈。

// 獲取下發權限
const templateId = ['xxx', 'xxx', 'xxx'];
let subscribeMessage = that.data.settingMsg.authSetting['scope.subscribeMessage']; // 用於判斷是否禁止接收訂閱信息
if (subscribeMessage) {
  that.data.subscriptionData = {
    access_token: app.globalData.accessToken,
    openId: app.globalData.openId,
    subscribe_templates: []
  };
  // 包含總是允許、總是取消、點擊允許、點擊取消情況
  that.subscribeMessage(templateId);  
} else { // 小程序設置--不允許接收訂閱信息情況
  wx.redirectTo({
    url: '../../pages/index/index'
  });
};