微信小程序模板消息实例

Posted on | In

摘要:

这是一篇关于微信小程序模板消息的实例

模板消息管理：

小程序API提供了五个方法

  1. 获取小程序模板库标题列表
  2. 获取模板库某个模板标题下关键词库
  3. 组合模板并添加至帐号下的个人模板库
  4. 获取帐号下已存在的模板列表
  5. 删除帐号下的某个模板

这里我没这么麻烦，我直接在微信公众平台手动配置了模板，详见小程序文档。这里我主要讲讲发送消息模版

发送模板消息：

他要接收几个参数

参数 必填 说明
touser 是 接收者（用户）的 openid
template_id 是 所需下发的模板消息的id
page 否 点击模板卡片后的跳转页面，仅限本小程序内的页面。
form_id 是 表单提交场景下，为 submit 事件带上的 formId；支付场景下，为本次支付的 prepay_id
data 是 模板内容，不填则下发空模板
color 否 模板内容字体的颜色，不填默认黑色 【废弃】
emphasis_keyword 否 模板需要放大的关键词，不填则默认无放大

好，让我一个一个来获取

touser

也就是获取用户的openid：这位兄弟已经写的非常清楚了，我的openid也是看着这篇博客做出来的，大家可以点进去学习学习。

template_id

所需下发的模板消息的id：在微信公众平台里边的模板消息模块自行获取。image

page

点击模板之后跳转到的小程序的路径，可写可不写。

form_id

这个关键了，你在form表单提交的时候得带上report-submit=”true”这个属性

1
2
3
<form report-submit="true" bindsubmit="formSubmit">
    <button formType="submit" class="next">提交报名</button>      
</form>

于是乎他就能返回 formid

1
2
3
 formSubmit: function (e) {
    console.log(e.detail.formId);
}

⚠️ 注意：

  1. formid在微信开发者工具里面并不能输出出来，必须得真机运行。
  2. formid只能用一次，下次若还想发送模板消息，得重新获取formid
  3. formid有效期仅七天

data

模板内容，不填则下发空模板，我的是这么写的：

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
{
  "touser": that.data.openid,
  "template_id": "2ST8VFURGEIFtwHZbkudmUwYb401Y8pzugctTkFC_Os",
  "page": "../mineActivity/mineActivity",
  "form_id": that.data.formid,
  "data": {
    "keyword1": {
      "value": "校友沙龙"
    },
    "keyword2": {
      "value": "2019年01月05日 12:30"
    },
    "keyword3": {
      "value": "深圳大学"
    },
    "keyword4": {
      "value": "广东省深圳市南山区深圳大学"
    },
    "keyword5": {
      "value": "15876092583"
    }
  },
  "emphasis_keyword": "keyword1.DATA"
}

获取到了POST参数，我们可以发起请求了

1
2
3
4
5
6
7
8
9
10
11
12
13
14
15
16
17
18
19
20
21
22
23
24
25
26
27
28
29
30
31
32
33
34
35
36
37
function wxhttp() {
  wx.request({
    method: 'POST',
    url: 'https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=' + that.data.access_token,
    data: {
      "touser": that.data.openid,
      "template_id": "2ST8VFURGEIFtwHZbkudmUwYb401Y8pzugctTkFC_Os",
      "page": "../mineActivity/mineActivity",
      "form_id": that.data.formid,
      "data": {
        "keyword1": {
          "value": "校友沙龙"
        },
        "keyword2": {
          "value": "2019年01月05日 12:30"
        },
        "keyword3": {
          "value": "深圳大学"
        },
        "keyword4": {
          "value": "广东省深圳市南山区深圳大学"
        },
        "keyword5": {
          "value": "15876092583"
        }
      },
      "emphasis_keyword": "keyword1.DATA"
    },
    header: header,
    success: (res) => {
      console.log('发送成功' + res)
    },
    fail: (err) => {
      console.log('请求失败' + err)
    }
  });
};

效果

image

这里呢可能客户有一个需求，就是群发消息模版。当我发起一个活动时，所有使用此小程序的用户都会收到一条活动消息通知（需求不是特别合理，咱这里只讨论技术，不讨论业务需求hhh），这块呢我仅有一个思路，具体实现还需要后端的帮忙，如果出来了呢会给大家发布一篇群发消息模版的实例。在此谢谢大家的观看了。