微信小程序实现发送模板消息功能示例【通过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 相关文章推荐
(currentStyle)javascript为何有时用style得不到已设定的CSS的属性
Aug 15 Javascript
JavaScript高级程序设计(第3版)学习笔记13 ECMAScript5新特性
Oct 11 Javascript
jQuery函数的等价原生函数代码示例
May 27 Javascript
js为空或不是对象问题的快速解决方法
Dec 11 Javascript
js实现百度联盟中一款不错的图片切换效果完整实例
Mar 04 Javascript
jQuery实现简单的日期输入格式化控件
Mar 12 Javascript
yarn与npm的命令行小结
Oct 20 Javascript
bootstrap datetimepicker实现秒钟选择下拉框
Jan 05 Javascript
javaScript基础详解
Jan 19 Javascript
JS ES6中setTimeout函数的执行上下文示例
Apr 27 Javascript
js 索引下标之li集合绑定点击事件
Jan 12 Javascript
cnpm加速Angular项目创建的方法
Sep 07 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制作静态网站的模板框架(一)
2006/10/09 PHP
PHP与SQL注入攻击[一]
2007/04/17 PHP
window+nginx+php环境配置 附配置搭配说明
2010/12/29 PHP
ThinkPHP中U方法的使用浅析
2014/06/13 PHP
解决ThinkPHP下使用上传插件Uploadify浏览器firefox报302错误的方法
2015/12/18 PHP
使用原生javascript创建通用表单验证——更锋利的使用dom对象
2011/09/13 Javascript
VBS通过WMI监视注册表变动的代码
2011/10/27 Javascript
Jquery提交表单 Form.js官方插件介绍
2012/03/01 Javascript
Node.js实现在目录中查找某个字符串及所在文件
2014/09/03 Javascript
完美兼容各大浏览器的jQuery插件实现图片切换特效
2014/12/12 Javascript
jQuery实现移动 和 渐变特效的点击事件
2015/02/26 Javascript
jquery实现仿新浪微博评论滚动效果
2015/08/06 Javascript
让你一句话理解闭包(简单易懂)
2016/06/03 Javascript
React Native中Navigator的使用方法示例
2017/10/13 Javascript
jquery实现掷骰子小游戏
2019/10/24 jQuery
webpack常用构建优化策略小结
2019/11/21 Javascript
微信小程序实现可长按移动控件
2020/11/01 Javascript
Python中的Classes和Metaclasses详解
2015/04/02 Python
如何基于Python制作有道翻译小工具
2019/12/16 Python
Parts Express:音频、视频和扬声器的第一来源
2017/04/25 全球购物
澳大利亚领先的孕妇服装品牌:Mamaway
2018/08/14 全球购物
纽约香氛品牌:NEST Fragrance
2018/10/15 全球购物
C#的几个面试问题
2016/05/22 面试题
毕业生物理教师求职信
2013/10/17 职场文书
顶岗实习计划书
2014/01/10 职场文书
计算机毕业大学生求职信
2014/06/26 职场文书
国际金融专业自荐信
2014/07/05 职场文书
无房产证房屋转让协议书合同样本
2014/10/18 职场文书
2014年财务经理工作总结
2014/12/08 职场文书
学生党员检讨书范文
2014/12/27 职场文书
中层干部考核评语
2015/01/04 职场文书
观后感的写法
2015/06/19 职场文书
读《教育心理学》心得体会
2016/01/22 职场文书
描述鲁迅的名言整理,一生受用
2019/08/08 职场文书
IDEA使用SpringAssistant插件创建SpringCloud项目
2021/06/23 Java/Android
Nginx的gzip相关介绍
2022/05/11 Servers