微信小程序实现发送模板消息功能示例【通过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 相关文章推荐
深入理解javascript学习笔记(一) 编写高质量代码
Aug 09 Javascript
JavaScript输入邮箱自动提示实例代码
Jan 13 Javascript
jQuery实现简单二级下拉菜单
Apr 12 Javascript
bootstrap手风琴折叠示例代码分享
May 22 Javascript
js 奇葩技巧之隐藏代码
Aug 11 Javascript
JS实现浏览上传文件的代码
Aug 23 Javascript
详解在vue-cli中使用graphql即vue-apollo的用法
Sep 08 Javascript
javacript replace 正则取字符串中的值并替换【推荐】
Sep 13 Javascript
浅谈vue引用静态资源需要注意的事项
Sep 28 Javascript
react 应用多入口配置及实践总结
Oct 17 Javascript
vue--vuex详解
Apr 15 Javascript
原生JS封装拖动验证滑块的实现代码示例
Jun 01 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边学边教》(01.开篇――准备工作)
2006/12/13 PHP
解析coreseek for sphinx的使用
2013/06/21 PHP
PHP5.6新增加的可变函数参数用法分析
2017/08/25 PHP
一段好玩的JavaScript代码
2006/12/01 Javascript
js 替换
2008/02/19 Javascript
Javascript 表单之间的数据传递代码
2008/12/04 Javascript
十分钟打造AutoComplete自动完成效果代码
2009/12/26 Javascript
Jquery cookie操作代码
2010/03/14 Javascript
JavaScript中的稀疏数组与密集数组[译]
2012/09/17 Javascript
JavaScript中的undefined学习总结
2013/11/30 Javascript
Nodejs使用mysql模块之获得更新和删除影响的行数的方法
2014/03/18 NodeJs
web前端设计师们常用的jQuery特效插件汇总
2014/12/07 Javascript
Javascript无参数和有参数类继承问题解决方法
2015/03/02 Javascript
js点击列表文字对应该行显示背景颜色的实现代码
2015/08/05 Javascript
关于JavaScript的变量的数据类型的判断方法
2015/08/14 Javascript
javascript数据类型验证方法
2015/12/31 Javascript
基于Echarts 3.19 制作常用的图形(非静态)
2016/05/19 Javascript
jquery html动态添加的元素绑定事件详解
2016/05/24 Javascript
js数组的五种迭代方法及两种归并方法(推荐)
2016/06/14 Javascript
Angularjs实现分页和分页算法的示例代码
2016/12/23 Javascript
浅谈jQuery中事情的动态绑定
2017/02/12 Javascript
AngularJS中下拉框的基本用法示例
2017/10/11 Javascript
详解如何去除vue项目中的#——History模式
2017/10/13 Javascript
nodejs搭建本地服务器轻松解决跨域问题
2018/03/21 NodeJs
浅谈小程序 setData学问多
2019/02/20 Javascript
python 调用HBase的简单实例
2016/12/18 Python
python按照list中字典的某key去重的示例代码
2020/10/13 Python
HTML5中的Web Notification桌面右下角通知功能的实现
2018/04/19 HTML / CSS
英国DIY汽车维修配件网站:DIY Car Service Parts
2019/08/30 全球购物
拾金不昧的表扬信
2014/01/16 职场文书
学校领导班子群众路线整改措施
2014/09/16 职场文书
2019学校运动会开幕词
2019/05/13 职场文书
赞美教师的句子
2019/09/02 职场文书
范文之农村基层党建工作报告
2019/10/24 职场文书
SpringBoot整合Mybatis Generator自动生成代码
2021/08/23 Java/Android
Java 定时任务技术趋势简介
2022/05/04 Java/Android