微信小程序实现发送模板消息功能示例【通过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 相关文章推荐
最新的10款jQuery内容滑块插件分享
Sep 18 Javascript
JavaScript验证图片类型(扩展名)的函数分享
May 05 Javascript
JavaScript中的对象序列化介绍
Dec 30 Javascript
使用jspdf生成pdf报表
Jul 03 Javascript
es6的数字处理的方法(5个)
Mar 16 Javascript
ES6模块化的import和export用法方法总结
Aug 08 Javascript
ionic3+Angular4实现接口请求及本地json文件读取示例
Oct 11 Javascript
JavaScript引用类型Function实例详解
Aug 09 Javascript
vuejs2.0运用原生js实现简单拖拽元素功能
Aug 21 Javascript
elementUI vue this.$confirm 和el-dialog 弹出框 移动 示例demo
Jul 03 Javascript
解析原来浏览器原生支持JS Base64编码解码
Aug 12 Javascript
js get和post请求实现代码解析
Feb 06 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多线程批量采集下载美女图片的实现代码(续)
2013/06/03 PHP
PHP获取Exif缩略图的方法
2015/07/13 PHP
详细解读PHP中接口的应用
2015/08/12 PHP
thinkphp5框架前后端分离项目实现分页功能的方法分析
2019/10/08 PHP
网页常用特效代码整理
2006/06/23 Javascript
PJ Blog修改-禁止复制的代码和方法
2006/10/25 Javascript
收集的网上用的ajax之chat.js文件
2007/04/08 Javascript
xss文件页面内容读取(解决)
2010/11/28 Javascript
密码强度检测效果实现原理与代码
2013/01/04 Javascript
通过JS动态创建一个html DOM元素并显示
2014/10/15 Javascript
node.js使用require()函数加载模块
2014/11/26 Javascript
JavaScript对HTML DOM使用EventListener进行操作
2015/10/21 Javascript
webpack中引用jquery的简单实现
2016/06/08 Javascript
AngularJS 模型详细介绍及实例代码
2016/07/27 Javascript
jQuery实现发送验证码并60秒倒计时功能
2016/11/25 Javascript
js点击任意区域弹出层消失实现代码
2016/12/27 Javascript
Node.js中看JavaScript的引用
2017/04/22 Javascript
JS匿名函数和匿名自执行函数概念与用法分析
2018/03/16 Javascript
微信小程序开发之路由切换页面重定向问题
2018/09/18 Javascript
JavaScript进阶(一)变量声明提升实例分析
2020/05/09 Javascript
Python对数据库操作
2016/03/28 Python
Python3的介绍、安装和命令行的认识(推荐)
2018/10/20 Python
python url 参数修改方法
2018/12/26 Python
使用python制作一个解压缩软件
2019/11/13 Python
python爬虫开发之PyQuery模块详细使用方法与实例全解
2020/03/09 Python
利用html5的websocket实现websocket聊天室
2013/12/12 HTML / CSS
天猫超市:阿里巴巴打造的网上超市
2016/11/02 全球购物
瑜伽服装品牌:露露柠檬(lululemon athletica)
2017/06/04 全球购物
英国玛莎百货新西兰:Marks & Spencer New Zealand
2019/07/21 全球购物
开会迟到检讨书
2014/01/08 职场文书
军训鉴定表自我鉴定
2014/02/13 职场文书
保安岗位职责
2014/02/21 职场文书
高中学生会竞选演讲稿
2014/08/25 职场文书
学用政策心得体会
2014/09/10 职场文书
小学一年级数学教学计划
2015/01/20 职场文书
使用 Apache Dubbo 实现远程通信(微服务架构)
2022/02/12 Servers