小程序如何实现模板消息发送的功能-猿码集

小程序如何实现模板消息发送的功能

小程序作为现在非常流行的微信公众号的一种形式，可以帮助企业快速布局和开拓市场。而在小程序中，模板消息的使用，能够方便地实现对用户的实时提醒，让用户在使用小程序的时候更加顺畅。那么，小程序如何实现模板消息的发送功能呢？

1、后台配置

在小程序后台中，需要先进行模板消息的配置。打开小程序管理后台，进入开发->开发设置->模板消息，点击“添加模板”，即可开始进行配置操作。首先要填写模板标题以及相关示例代码：


{{keyword1.DATA}}
{{keyword2.DATA}}
{{keyword3.DATA}}
{{keyword4.DATA}}
{{keyword5.DATA}}
{{keyword6.DATA}}
{{keyword7.DATA}}

其中，{{keywordX.DATA}}表示所需要填写的数据，这里的X表示需要填写的数据的个数，取值范围为1到7。同时，还需要填写模板内容以及相关示例代码：


您有一条新的订单，请及时处理！
订单编号：{{keyword1.DATA}}
订单状态：{{keyword2.DATA}}
下单时间：{{keyword3.DATA}}
客户姓名：{{keyword4.DATA}}
联系电话：{{keyword5.DATA}}
订单金额：{{keyword6.DATA}}
订单备注：{{keyword7.DATA}}

在填写的时候，需要注意，{{keywordX.DATA}}中的X需要和模板标题中填写的数据个数保持一致，同时在模板内容中也需要将对应的数据位置填充好。

2、获取access_token

在调用微信接口之前，需要先获取access_token。我们可以在小程序的后端获取access_token，将其存储在缓存中，在发送模板消息时直接读取该缓存即可。


const APPID = "xxx"; // 小程序ID
const APPSECRET = "xxx"; // 小程序秘钥
/**
* 获取access_token
*/
function getAccessToken() {
  return new Promise((resolve, reject) => {
    wx.request({
      url: "https://api.weixin.qq.com/cgi-bin/token",
      data: {
        grant_type: "client_credential",
        appid: APPID,
        secret: APPSECRET
      },
      success: function (res) {
        if (res.data.access_token) {
          resolve(res.data.access_token)
        } else {
          reject(res.data.errmsg)
        }
      },
      fail: function (err) {
        reject(err)
      }
    })
  })
}

这里我们使用Promise来异步获取access_token，方便后续的调用。

3、发送模板消息

获取到access_token之后，我们就可以开始发送模板消息了。使用微信提供的模板消息发送接口，代码如下：


const TEMPLATE_ID = "xxx"; // 模板ID
const ACCESS_TOKEN = "xxx"; // access_token
const OPEN_ID = "xxx"; // 用户的openid
/**
* 发送模板消息
*/
function sendTemplateMessage() {
  var data = {
    "touser": OPEN_ID,
    "template_id": TEMPLATE_ID,
    "miniprogram": {
      "appid": "xxx",
      "pagepath": "pages/index/index"
    },
    "data": {
      "keyword1": {
        "value": "123456"
      },
      "keyword2": {
        "value": "已发货"
      },
      "keyword3": {
        "value": "2022-02-02 12:12:12"
      },
      "keyword4": {
        "value": "张三"
      },
      "keyword5": {
        "value": "13812345678"
      },
      "keyword6": {
        "value": "100.00"
      },
      "keyword7": {
        "value": "无"
      }
    }
  }
  wx.request({
    url: "https://api.weixin.qq.com/cgi-bin/message/template/send?access_token=" + ACCESS_TOKEN,
    method: 'POST',
    data: data,
    success: function (res) {
      console.log(res.data)
    },
    fail: function (err) {
      console.log(err)
    }
  })
}

在这里，我们需要填写的是模板ID和用户的openid，同时也需要将发送的数据按照模板需求进行填充。发送模板消息时，需要将所有数据填充完成之后，将其作为data参数传入微信提供的模板消息发送接口中。

4、小程序前端实现

在小程序前端中，我们可以通过微信提供的模板消息按钮来触发发送模板消息的操作，代码如下：


/**
* 发送模板消息
*/
function sendMessage() {
  // 调用发送消息接口
  sendTemplateMessage()
}
Page({
  data: {
  },
  // 发送模板消息
  send: function () {
    wx.showModal({
      title: '提示',
      content: '确认发送模板消息？',
      success(res) {
        if (res.confirm) {
          // 发送模板消息
          sendMessage()
        } else if (res.cancel) {
          console.log('用户点击取消')
        }
      }
    })
  }
})

这里我们通过一个按钮来触发发送消息的操作，当用户点击发送按钮时，会弹出一个确认框，用户确认发送后，即可发送模板消息。

总结

通过以上的介绍，我们可以看到，小程序实现模板消息功能的过程，其实是比较简单的。只需要在小程序后台中进行模板消息的配置，在小程序前端中触发发送消息的操作，同时在后端获取access_token并调用微信提供的发送模板消息接口即可。当然，具体的实现过程会依赖于所采用的技术栈和业务需求，但总的来说，小程序实现模板消息的功能还是比较容易的。

小程序如何实现模板消息发送的功能