微信小程序实现发送模板消息功能示例【通过openid推送消息给用户】


Posted in Javascript onMay 05, 2019

本文实例讲述了微信小程序实现发送模板消息功能。分享给大家供大家参考,具体如下:

一、获取access_token

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

获取access_token的接口地址:

https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=APPID&secret=APPSECRET

返回参数格式:

{"access_token": "ACCESS_TOKEN", "expires_in": 7200}

二、发送模板消息

先在微信公众平台选用怒需要的模板id,例如

选用模板消息:

https://mp.weixin.qq.com/wxopen/tmplmsg?action=self_list&token=264012870&lang=zh_CN

选用的是购买成功的模板,关键字可以自己定义顺序,如果不符合你的情况,还可以自定义关键字

微信小程序实现发送模板消息功能示例【通过openid推送消息给用户】

选用好了之后,可以在我的模板中查看。然后将其模板id复制过来。

类似于这样 : _CfGS7SqVyNPg9Op8OXzMp6aOl7X9rCkrRfiMcccms8

发送模板的消息接口地址:

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

参数:

touser (必填) 接收者(用户)的 openid
template_id (必填) 所需下发的模板消息的id
page (可选) 点击模板卡片后的跳转页面,仅限本小程序内的页面。支持带参数,(示例index?foo=bar)。该字段不填则模板无跳转。
form_id (必填) 表单提交场景下,为 submit 事件带上的 formId;支付场景下,为本次支付的 prepay_id
data (必填) 模板内容,不填则下发空模板
color (可选) 模板内容字体的颜色,不填默认黑色
emphasis_keyword (可选) 模板需要放大的关键词,不填则默认无放大

例如

html

<form bind:submit="testSubmit" report-submit="true">
  <button formType="submit">发送模板消息</button>
 </form>

js

testSubmit:function(e){
 var self= this;
 let _access_token = '5_E1pZJQzTC-lC0r-JJz9wVAZv5Zv22CNtmV_7C1T0sqC9TV7mGE4FTmDX2B0PVM4LaGtaTfXwzfJLnD7fDKTg8DOICJNkKBQgn_Ot2zYmBJyY1g1VXoBNdtwUE0QaP8_9tWlbR-Zq7L1OyrrPKCIjAEAOGM';
 let url='https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token='+_access_token
; let _jsonData = {
  access_token: _access_token,
  touser: openid,
  template_id: '_CfGS7SqVyNPg9Op8OXzMp6aOl7X9rCkrRfiMcccms8',
  form_id: e.detail.formId,
  page: "pages/index/index",
  data: {
  "keyword1": { "value": "测试数据一", "color": "#173177" },
  "keyword2": { "value": "测试数据二", "color": "#173177" },
  "keyword3": { "value": "测试数据三", "color": "#173177" },
  "keyword4": { "value": "测试数据四", "color": "#173177" },
  }
 }
 wx.request({
  url: url,
  data: data,
  method: method,
  success: function (res) {
   console.log(res)
  },
  fail: function (err) {
   console.log('request fail ', err);
  },
  complete: function (res) {
   console.log("request completed!");
  }
 })

结果:

类似于这种

微信小程序实现发送模板消息功能示例【通过openid推送消息给用户】

希望本文所述对大家微信小程序开发有所帮助。

Javascript 相关文章推荐
javascritp实现input输入框相关限制用法
Jun 29 Javascript
js 提交和设置表单的值
Dec 19 Javascript
textarea中的手动换行处理的jquery代码
Feb 26 Javascript
javascript中的if语句使用介绍
Nov 20 Javascript
jquery中each方法示例和常用选择器
Jul 08 Javascript
Bootstrap carousel轮转图的使用实例详解
May 17 Javascript
input 禁止输入特殊字符的四种实现方式
Aug 24 Javascript
jquery获取input type=text中的值的各种方式(总结)
Dec 02 Javascript
通过jquery获取上传文件名称、类型和大小的实现代码
Apr 19 jQuery
解决vue A对象赋值给B对象,修改B属性会影响到A的问题
Sep 25 Javascript
详解Axios统一错误处理与后置
Sep 26 Javascript
详解Vue组件之作用域插槽
Nov 22 Javascript
浅谈Node 异步IO和事件循环
May 05 #Javascript
vue的列表交错过渡实现代码示例
May 05 #Javascript
微信小程序上传多图到服务器并获取返回的路径
May 05 #Javascript
详解如何在vue项目中使用layui框架及采坑
May 05 #Javascript
详解小程序input框失焦事件在提交事件前的处理
May 05 #Javascript
详解小程序毫秒级倒计时(适用于拼团秒杀功能)
May 05 #Javascript
小程序关于请求同步的总结
May 05 #Javascript
You might like
php intval的测试代码发现问题
2008/07/27 PHP
ThinkPHP权限认证Auth实例详解
2014/07/22 PHP
php实现cookie加密的方法
2015/03/10 PHP
标准PHP的AES加密算法类
2015/03/12 PHP
PHP5.4起内置web服务器使用方法
2016/08/09 PHP
PHP命名空间与自动加载机制的基础介绍
2019/08/25 PHP
laravel 查询数据库获取结果实现判断是否为空
2019/10/24 PHP
javascript写的简单的计算器,内容很多,方法实用,推荐
2011/12/29 Javascript
用js读、写、删除Cookie代码续篇
2014/12/03 Javascript
Node.js的包详细介绍
2015/01/14 Javascript
nodejs实现遍历文件夹并统计文件大小
2015/05/28 NodeJs
jQuery实现仿微软首页感应鼠标变化滑动窗口效果
2015/10/08 Javascript
js获取时间精确到秒(年月日)
2016/03/16 Javascript
原生JS:Date对象全面解析
2016/09/06 Javascript
javascript设计模式之中介者模式学习笔记
2017/02/15 Javascript
关于jQuery里prev()的简单操作代码
2017/10/27 jQuery
axios进阶实践之利用最优雅的方式写ajax请求
2017/12/20 Javascript
Vue前后端不同端口的实现方法
2018/09/19 Javascript
ES6顶层对象、global对象实例分析
2019/06/14 Javascript
通过实例了解Javascript柯里化流程
2020/03/03 Javascript
Postman动态获取返回值过程详解
2020/06/30 Javascript
在Echarts图中给坐标轴加一个标识线markLine
2020/07/20 Javascript
原生JS实现pc端轮播图效果
2020/12/21 Javascript
利用JS判断元素是否为数组的方法示例
2021/01/08 Javascript
Python实现的简单文件传输服务器和客户端
2015/04/08 Python
使用Python写个小监控
2016/01/27 Python
理解python中生成器用法
2017/12/20 Python
十分钟搞定pandas(入门教程)
2019/06/21 Python
Python requests模块session代码实例
2020/04/14 Python
基于python获取本地时间并转换时间戳和日期格式
2020/10/27 Python
Free People中国官网:波西米亚风格女装服饰
2016/08/30 全球购物
好莱坞百老汇御用王牌美妆:Koh Gen Do 江原道
2018/04/03 全球购物
乐高官方旗舰店:LEGO积木玩具
2019/04/06 全球购物
将n个数按输入顺序的逆序排列,用函数实现
2012/11/14 面试题
毕业生求职自荐书范文
2014/03/27 职场文书
探亲假请假条
2014/04/11 职场文书