微信小程序实现发送模板消息功能示例【通过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 相关文章推荐
动态样式类封装JS代码
Sep 02 Javascript
Javascript基础教程之argument 详解
Jan 18 Javascript
Jquery Ajax xmlhttp请求成功问题
Feb 04 Javascript
javaScript基础语法介绍
Feb 28 Javascript
在Javascript操作JSON对象,增加 删除 修改的简单实现
Jun 02 Javascript
jQuery插件cxSelect多级联动下拉菜单实例解析
Jun 24 Javascript
jquery层级选择器的实现(匹配后代元素div)
Sep 05 Javascript
js实现canvas图片与img图片的相互转换的示例
Aug 31 Javascript
vue-router的使用方法及含参数的配置方法
Nov 13 Javascript
vue.js 2.*项目环境搭建、运行、打包发布的详细步骤
May 01 Javascript
微信小程序中button去除默认的边框实例代码
Aug 01 Javascript
JavaScript 实现轮播图特效的示例
Nov 05 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实时显示输出
2008/10/02 PHP
visual studio code 调试php方法(图文详解)
2017/09/15 PHP
PHP的mysqli_stat()函数讲解
2019/01/23 PHP
Dojo之路:如何利用Dojo实现Drag and Drop效果
2007/04/10 Javascript
在网站上应该用的30个jQuery插件整理
2011/11/03 Javascript
jquery在IE、FF浏览器的差别详细探讨
2013/04/28 Javascript
js使用ajax读博客rss示例
2014/05/06 Javascript
javascript里使用php代码实例
2014/12/13 Javascript
JavaScript多线程详解
2015/08/12 Javascript
AngularJS上拉加载问题解决方法
2016/05/23 Javascript
jquery获取复选框的值的简单实例
2016/05/26 Javascript
NODE.JS跨域问题的完美解决方案
2016/10/20 Javascript
javascript设置文本框光标的方法实例小结
2016/11/04 Javascript
深入理解node.js之path模块
2017/05/03 Javascript
JS使用正则表达式找出最长连续子串长度
2017/10/26 Javascript
vue使用自定义icon图标的方法
2018/05/14 Javascript
vue弹窗组件的实现示例代码
2018/09/10 Javascript
JavaScript类型相关的常用操作总结
2019/02/14 Javascript
Ant design vue table 单击行选中 勾选checkbox教程
2020/10/24 Javascript
深入Python函数编程的一些特性
2015/04/13 Python
利用python获取Ping结果示例代码
2017/07/06 Python
Python3中条件控制、循环与函数的简易教程
2017/11/21 Python
TensorFlow saver指定变量的存取
2018/03/10 Python
详解django三种文件下载方式
2018/04/06 Python
Python集中化管理平台Ansible介绍与YAML简介
2019/06/12 Python
通过python检测字符串的字母
2020/02/18 Python
keras topN显示,自编写代码案例
2020/07/03 Python
给Django Admin添加验证码和多次登录尝试限制的实现
2020/07/26 Python
Python如何使用vars返回对象的属性列表
2020/10/17 Python
python切割图片的示例
2020/11/12 Python
仿酷狗html5手机音乐播放器主要部分代码
2013/05/15 HTML / CSS
美国奢侈品在线团购网站:Gilt City
2017/11/16 全球购物
英国女性化妆品收纳和家具网站:Beautify
2019/12/07 全球购物
三八妇女节活动总结
2014/05/04 职场文书
2014年城市管理工作总结
2014/12/02 职场文书
2015年财务部年度工作总结
2015/05/19 职场文书