一、添加模板

登录https://mp.weixin.qq.com获取模板,如果没有合适的模板,可以申请添加新模板,审核通过后可使用,详见模板审核说明

页面的 <form/> 组件,属性report-submittrue时,可以声明为需发模板消息,此时点击按钮提交表单可以获取formId,用于发送模板消息。或者当用户完成支付行为,可以获取prepay_id用于发送模板消息。

表单

<form bindsubmit="formSubmit" report-submit='true' >
...
<view class="btn-area">
<button formType="submit">Submit</button>
</view>
</form> 脚本 Page({
formSubmit: function(e) {
console.log('form发生了submit事件,formId为:', e.detail.value)
}
})

report-submit 是否返回 formId 用于发送模板消息

二、发送模板消息

接口地址:(ACCESS_TOKEN 需换成上文获取到的 access_token)

https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=ACCESS_TOKEN

HTTP请求方式:

POST

POST参数说明:

参数 必填 说明
touser 接收者(用户)的 openid
template_id 所需下发的模板消息的id
page 点击模板卡片后的跳转页面,仅限本小程序内的页面。支持带参数,(示例index?foo=bar)。该字段不填则模板无跳转。
form_id 表单提交场景下,为 submit 事件带上的 formId;支付场景下,为本次支付的 prepay_id
data 模板内容,不填则下发空模板
color 模板内容字体的颜色,不填默认黑色
emphasis_keyword 模板需要放大的关键词,不填则默认无放大
示例:
{
"touser": "OPENID",
"template_id": "TEMPLATE_ID",
"page": "index",
"form_id": "FORMID",
"data": {
"keyword1": {
"value": "339208499",
"color": "#173177"
},
"keyword2": {
"value": "2015年01月05日 12:30",
"color": "#173177"
},
"keyword3": {
"value": "粤海喜来登酒店",
"color": "#173177"
} ,
"keyword4": {
"value": "广州市天河区天河路208号",
"color": "#173177"
}
},
"emphasis_keyword": "keyword1.DATA"
}

特别说明:touser的OpenId 只能为当前用户的OpenId ,即 模板消息只能发给当前提交表单的用户

返回码说明:

在调用模板消息接口后,会返回JSON数据包。

正常时的返回JSON数据包示例:

{
"errcode": 0,
"errmsg": "ok",
}

错误时会返回错误码信息,说明如下:

返回码 说明
40037 template_id不正确
41028 form_id不正确,或者过期
41029 form_id已被使用
41030 page不正确
45009 接口调用超过限额(目前默认每个帐号日调用限额为100万)

官网地址:https://mp.weixin.qq.com/debug/wxadoc/dev/api/notice.html

欢迎阅读本系列文章:微信小程序开发教程目录

微信小程序开发之模板消息的更多相关文章

  1. 微信小程序开发之模板

    一.简介 WXML提供模板(template),可以在模板中定义代码片段,然后在不同的地方调用. 定义模板 使用name属性,作为模板的名字.然后在<template/>内定义代码片段,如 ...

  2. 微信小程序开发 [04] 模板和模块化

    1.模板 如果相同的wxml代码可能在不同的页面重复使用,ctrl+c配合ctrl+v的方式,后期维护起来未免也太麻烦了.微信提供了"模板",可以在模板中定义代码片段,然后在不同的 ...

  3. 微信小程序之发送模板消息(通过openid推送消息给用户)

    一.获取access_token access_token是接口调用的凭证,目前有效期为两个小时,需要定时刷新,重复获取将导致上次获取的access_token失效.(注:不建议每次调用需要acces ...

  4. 微信小程序开发:设置消息推送

    开发设置中,启用并设置消息推送配置后,用户发给小程序的消息以及开发者需要的事件推送,都将被微信转发至该服务器地址中. 不过照着说明去操作,即使按照最简单的明文方式去设置,还是提示Token验证失败.仔 ...

  5. 微信小程序开发教程目录

    本系列教程是自己在工作中使用到而记录的,没有顺序之分 如有错误之处,请给与指正,也不希望误导了别人 微信小程序开发教程目录 微信小程序之注册和入门 微信小程序之HTTPS请求 微信小程序开发之选项卡 ...

  6. 微信小程序开发:学习笔记[2]——WXML模板

    微信小程序开发:学习笔记[2]——WXML模板 快速开始 介绍 WXML 全称是 WeiXin Markup Language,是小程序框架设计的一套标签语言,结合小程序的基础组件.事件系统,可以构建 ...

  7. 微信小程序开发详解——小程序,大颠覆!

    微信小程序开发 联系 苏念 188.1414.7927  微信小程序系统开发 微信新功能开发 小程序开发 小程序怎么开发 app小程序开发 简化小程序开发 微信小程序定制 小程序制作 开发微信小程序  ...

  8. 微信小程序开发问题汇总

    前言 经过将近一个多月的开发,我们团队开发的微信小程序 "出发吧一起" 终于开发完成,现在的线上版本为 2.2.4-beta 版 本文档主要介绍该小程序在开发中所用到的技术,已经在 ...

  9. 微信小程序开发03-这是一个组件

    编写组件 基本结构 接上文:微信小程序开发02-小程序基本介绍 我们今天先来实现这个弹出层: 之前这个组件是一个容器类组件,弹出层可设置载入的html结构,然后再设置各种事件即可,这种组件有一个特点: ...

随机推荐

  1. 2017最新PHP面试题

    这几天在面试,下面分享一下这几天面试所遇到的笔试题,目前还不打算工作,面试题会持续更新的,有些不想写答案了,有心的可以自己看着面试题查一下感觉记忆更深点.下面分享一下这几天遇到的php面试题. 掌贝面 ...

  2. Scala入门系列(八):面向对象之trait

    基础知识 1 将trait作为接口使用 此时Trait就与Java中的接口非常类似,不过注意,在Scala中无论继承还是trait,统一都是extends关键字. Scala跟Java 8前一样不支持 ...

  3. javascript设计模式——迭代器模式

    前面的话 迭代器模式是指提供一种方法顺序访问一个聚合对象中的各个元素,而又不需要暴露该对象的内部表示.迭代器模式可以把迭代的过程从业务逻辑中分离出来,在使用迭代器模式之后,即使不关心对象的内部构造,也 ...

  4. vue——props的两种常用方法

    vue--props的两种常用方法 1.实现父-->子的通信 举例如下: 父组件 parent.vue <children :channel="object1"> ...

  5. CSS的常见问题

    1.css的编码风格 多行式:可读性越强,但是CSS文件的行数过多,影响开发速度,增大CSS文件的大小 一行式:可读性稍差,有效减少CSS文件的行数,有利于提高开发速度,减小CSS文件的大小 2.id ...

  6. 【NOIP2013提高组】火柴排队

    https://www.luogu.org/problem/show?pid=1966 Σ(ai-bi)2=Σai2+Σbi2-2Σai*bi,要使Σ(ai-bi)2最小,则需2Σai*bi最大. 由 ...

  7. 家居环境监測系统设计(PC上位机版)(手机APP版待定)

    下面是我的毕业设计:家居环境监測系统设计(PC上位机临时版.手机app版待定).本系统採用STC12C5A60S2单片机.结合传感器.分别对空气湿度.空气温度.气压.海拔.进水温度.出水温度.光照强度 ...

  8. VUE-CLI Vue安装及开发,npm run build无法查看项目的问题

    Vue-cli 本地安装vue项目 需要安装node.js,用node命令行npm的方式安装Vue 步骤: 1.进入项目地址安装 npm install vue-cli -g 2.初始化一下 ESli ...

  9. Jquery 改变样式

    Jquery简单的操作 Jquery 是一个非常好用JS库,有很多的特殊的操作,为了方便,我们都可以引入Jquery. <script src="dist/js/vendor/jque ...

  10. springboot 结合mybatis

    MyBatis 是一款优秀的持久层框架,它支持定制化 SQL.存储过程以及高级映射.MyBatis 避免了几乎所有的 JDBC 代码和手动设置参数以及获取结果集.MyBatis 可以使用简单的 XML ...