小程序模板網(wǎng)

微信模版消息的使用

發(fā)布時(shí)間:2018-04-25 10:34 所屬欄目:小程序開(kāi)發(fā)教程

上星期公司項(xiàng)目需求加入模版消息推送功能,今天在這整理一下:

微信的模版消息分為公眾號(hào)的和小程序的。它們兩大同小異,只是小程序的模版消息里有個(gè)form_id參數(shù)需要多加注意,并且只能在真機(jī)上測(cè)試,要不這個(gè)form_id參數(shù)值你是拿不到的。

第一步,獲取用戶openId。有兩個(gè)方法,思路都一樣:調(diào)wx.login得到code(一次性的,不可重復(fù)利用),由code換取openId(這步有兩個(gè)方法,都應(yīng)該在后臺(tái)完成,前臺(tái)測(cè)試時(shí),請(qǐng)?jiān)陂_(kāi)發(fā)工具里按如下配置)。一般使用第二種方法,因?yàn)樗€可以返回用戶的基本信息,這貌似是一般小程序必用到的信息。第一種方法只會(huì)獲取到openId、session_key。

方法一:

wx.login({
  success: function (logincode) {
    if (logincode.code) {
      wx.request({
        url: 'https://api.weixin.qq.com/sns/jscode2session?appid=yourappid&secret=yoursecret&js_code=' + logincode.code + '&grant_type=authorization_code',
        header: {
          'content-type': 'application/json'
        },
        success: function (resle) {
          that.globalData.openId_true = resle.data.openid;
        }
      })
    }
  }
});

方法二:

注意點(diǎn):當(dāng) withCredentials 為 true 時(shí),要求此前有調(diào)用過(guò) wx.login 且登錄態(tài)尚未過(guò)期,此時(shí)返回的數(shù)據(jù)會(huì)包含 encryptedData, iv 等敏感信息;當(dāng) withCredentials 為 false 時(shí),不要求有登錄態(tài),返回的數(shù)據(jù)不包含 encryptedData, iv 等敏感信息。

wx.login({
  success: function (loginres) {
    if (loginres.code) {

      wx.getUserInfo({
        withCredentials: true,
        lang: 'zh_CN',
        success: function (res) {
          wx.request({
            url: 'https://le.beiebi.com/lkt/api/scanLogin/appletScanLogin',
            method: 'POST',
            header: {
              'content-type': 'application/x-www-form-urlencoded'
            },
            data: { code: loginres.code, encryptedData: res.encryptedData, iv: res.iv, unionid: '' },
            success: function (res) {
              openId = res.userInfo.openId
            }, fail: function () {

            }
          })
        }, fail: function () {

        }
      })
    }
  }
})

第二步,獲取access_token(也應(yīng)該在后臺(tái)完成)。

注意點(diǎn):access_token有效時(shí)限兩個(gè)小時(shí),每天的生成次數(shù)有限(2000次),所以需要在后臺(tái)做緩存,這里只是模擬一下。

  getAccess_token:function (client_credential, appid, secret,formId) {

    var that = this;
    if (that.data.isTime){
      var dic = {
        grant_type: client_credential,
        appid: appid,
        secret: secret,
      }

      util.httpsGetRequest("https://api.weixin.qq.com/cgi-bin/token", dic, function (success) {

        console.info('-----access_token==' + success.access_token);
        access_token = success.access_token;
        wx.setStorageSync('access_token',success.access_token);
        that.sendMessage(formId);

        that.data.isTime = false;
        var date = new Date();
        that.data.timestamp = date.getTime();
        that.countdown(that, that.data.timestamp + 7200);
      })
    } else {
      access_token = wx.getStorageSync('access_token');
      that.sendMessage(formId);
    }
  },

第三步,發(fā)送模版消息。

注意點(diǎn):下面寫(xiě)了兩個(gè)字典裝參數(shù),其中dic1為公眾號(hào)發(fā)送模版消息需要的參數(shù),dic為小程序發(fā)送模版消息需要的參數(shù)。其中的formId,表單提交場(chǎng)景下,為 submit 事件帶上的 formId(

e.detail.formId);支付場(chǎng)景下,為本次支付的 prepay_Id。

sendMessage: function (formId) {

  var dic1 = {
    "touser": app.globalData.openId_true,
    "template_id": "9I2cE23DPBi_nlYZLSJT-YK_DAMvGmmwyOnYTiSD523",
    "miniprogram": {
      "appid": appid,
      "pagepath": "pages/index/qqq/aaa/aaa?analysisReportId=2050&openId=1"
    },
    "color": "#173177",

    "data": {
      "first": {
        "value": "恭喜你購(gòu)買(mǎi)成功!",
        "color": "#173177"
      },
      "keyword1": {
        "value": "vip1867332110254",
        "color": "#173177"
      },
      "keyword2": {
        "value": "深圳一起賺錢(qián)科技有限公司",
        "color": "#173177"
      },
      "keyword3": {
        "value": "1500元",
        "color": "#173177"
      },
      "remark": {
        "value": "歡迎再次購(gòu)買(mǎi)!",
        "color": "#173177"
      }
    }
  }

  var dic = {
    "touser": app.globalData.openId_true,
    "template_id": "9I2cE23DPBi_nlYZLSJT-YK_DAMvGmmwyOnWFDFfgd”,
    "page": "pages/index/qqq/aaa/aaa?analysisReportId=2050&openId=1",
    "form_id": formId,
    "data": {
      "keyword1": {
        "value": "樂(lè)奔快遞",
        "color": "#173177"
      },
      "keyword2": {
        "value": "2017年11月13日 12:00",
        "color": "#173177"
      },
      "keyword3": {
        "value": "iPhone11",
        "color": "#173177"
      },
      "keyword4": {
        "value": "12545568461025",
        "color": "#173177"
      },
      "keyword5": {
        "value": "貝貝",
        "color": "#173177"
      }
    },
    "emphasis_keyword": "keyword1.DATA"
  }

  util.httpsPostRequest("https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=" + access_token, dic, function (success) {
    console.info('access_tokenerrmsg==' + success.errmsg);
  })
},

其余代碼:

//表單提交
formSubmit: function (e) {
  if (wx.getStorageSync('isTime') != '') {
    this.data.isTime = wx.getStorageSync('isTime');
    console.log('sync=isTime=', wx.getStorageSync('isTime'));
    console.log('sync=access_token=', wx.getStorageSync('access_token'));
  }

  this.getAccess_token('client_credential', appid, secret, e.detail.formId);
},
countdown: function (that, time) {
  if (time < that.data.timestamp + 60) {
    console.log('=shijiandao=')
    that.data.isTime = true;
    wx.setStorageSync('isTime', that.data.isTime);
    return;
  }
  setTimeout(function () {
    time = time - 1;
    that.countdown(that, time);
  }, 1000)
},


易優(yōu)小程序(企業(yè)版)+靈活api+前后代碼開(kāi)源 碼云倉(cāng)庫(kù):starfork
本文地址:http://22321a.com/wxmini/doc/course/24032.html 復(fù)制鏈接 如需定制請(qǐng)聯(lián)系易優(yōu)客服咨詢:800182392 點(diǎn)擊咨詢
QQ在線咨詢