找回密码
 立即注册

QQ登录

只需一步,快速开始

微信小程序模板消息的使用

[复制链接]
查看: 117|回复: 1
最佳答案
0 

7

主题

7

帖子

155

积分

新人求带

积分
155
 楼主| 发表于 2017-11-15 10:22:22 | 显示全部楼层 |阅读模式
上星期公司项目需求加入模版消息推送功能,今天在这整理一下:

微信的模版消息分为公众号的和小程序的。它们看起来差不多,但还是有点区别的:

模板推送位置:公众号的是本公众号页面,小程序的是服务通知。

模板下发条件:公众号可以像我们在原生app里推送通知一样进行下发,客户无需主动触发;小程序里需用户在微信体系内与页面有交互行为后触发,小程序不能推送消息,只有用户主动发起的事件并确认需要收到后续反馈,才会收到消息。

模版次数的限制:公众号有10w+,根据粉丝量来决定;小程序官方文档里说的什么提交表单7天内推送条数有限,支付一次可以推送3条,如果不懂就每次都提交,这样就没有限制了。

只是小程序的模版消息里有个form_id参数需要多加注意,并且只能在真机上测试,要不这个form_id参数值你是拿不到的。

第一步,获取用户openId。有两个方法,思路都一样:调wx.login得到code(一次性的,不可重复利用),由code换取openId(这步有两个方法,都应该在后台完成,前台测试时,请在开发工具里按如下配置)。一般使用第二种方法,因为它还可以返回用户的基本信息,这貌似是一般小程序必用到的信息。第一种方法只会获取到openId、session_key。
955413-20171113172510937-2092057254.png

方法一:
  1. wx.login({
  2.   success: function (logincode) {
  3.     if (logincode.code) {
  4.       wx.request({
  5.         url: 'https://api.weixin.qq.com/sns/jscode2session?appid=yourappid&secret=yoursecret&js_code=' + logincode.code + '&grant_type=authorization_code',
  6.         header: {
  7.           'content-type': 'application/json'
  8.         },
  9.         success: function (resle) {
  10.           that.globalData.openId_true = resle.data.openid;
  11.         }
  12.       })
  13.     }
  14.   }
  15. });
复制代码

方法二:

注意点:当 withCredentials 为 true 时,要求此前有调用过 wx.login 且登录态尚未过期,此时返回的数据会包含 encryptedData, iv 等敏感信息;当 withCredentials 为 false 时,不要求有登录态,返回的数据不包含 encryptedData, iv 等敏感信息。
  1. wx.login({
  2.   success: function (loginres) {
  3.     if (loginres.code) {

  4.       wx.getUserInfo({
  5.         withCredentials: true,
  6.         lang: 'zh_CN',
  7.         success: function (res) {
  8.           wx.request({
  9.             url: 'https://le.beiebi.com/lkt/api/scanLogin/appletScanLogin',
  10.             method: 'POST',
  11.             header: {
  12.               'content-type': 'application/x-www-form-urlencoded'
  13.             },
  14.             data: { code: loginres.code, encryptedData: res.encryptedData, iv: res.iv, unionid: '' },
  15.             success: function (res) {
  16.               openId = res.userInfo.openId
  17.             }, fail: function () {

  18.             }
  19.           })
  20.         }, fail: function () {

  21.         }
  22.       })
  23.     }
  24.   }
  25. })
复制代码

第二步,获取access_token(也应该在后台完成)。

注意点:access_token有效时限两个小时,每天的生成次数有限(2000次),所以需要在后台做缓存,这里只是模拟一下。
  1.   getAccess_token:function (client_credential, appid, secret,formId) {

  2.     var that = this;
  3.     if (that.data.isTime){
  4.       var dic = {
  5.         grant_type: client_credential,
  6.         appid: appid,
  7.         secret: secret,
  8.       }

  9.       util.httpsGetRequest("https://api.weixin.qq.com/cgi-bin/token", dic, function (success) {

  10.         console.info('-----access_token==' + success.access_token);
  11.         access_token = success.access_token;
  12.         wx.setStorageSync('access_token',success.access_token);
  13.         that.sendMessage(formId);

  14.         that.data.isTime = false;
  15.         var date = new Date();
  16.         that.data.timestamp = date.getTime();
  17.         that.countdown(that, that.data.timestamp + 7200);
  18.       })
  19.     } else {
  20.       access_token = wx.getStorageSync('access_token');
  21.       that.sendMessage(formId);
  22.     }
  23.   },
复制代码

第三步,发送模版消息。

注意点:下面写了两个字典装参数,其中dic1为公众号发送模版消息需要的参数,dic为小程序发送模版消息需要的参数。其中的formId,表单提交场景下,为 submit 事件带上的 formId(

e.detail.formId);支付场景下,为本次支付的 prepay_Id。
  1. sendMessage: function (formId) {

  2.   var dic1 = {
  3.     "touser": app.globalData.openId_true,
  4.     "template_id": "9I2cE23DPBi_nlYZLSJT-YK_DAMvGmmwyOnYTiSD523",
  5.     "miniprogram": {
  6.       "appid": appid,
  7.       "pagepath": "pages/index/qqq/aaa/aaa?analysisReportId=2050&openId=1"
  8.     },
  9.     "color": "#173177",

  10.     "data": {
  11.       "first": {
  12.         "value": "恭喜你购买成功!",
  13.         "color": "#173177"
  14.       },
  15.       "keyword1": {
  16.         "value": "vip1867332110254",
  17.         "color": "#173177"
  18.       },
  19.       "keyword2": {
  20.         "value": "深圳一起赚钱科技有限公司",
  21.         "color": "#173177"
  22.       },
  23.       "keyword3": {
  24.         "value": "1500元",
  25.         "color": "#173177"
  26.       },
  27.       "remark": {
  28.         "value": "欢迎再次购买!",
  29.         "color": "#173177"
  30.       }
  31.     }
  32.   }

  33.   var dic = {
  34.     "touser": app.globalData.openId_true,
  35.     "template_id": "9I2cE23DPBi_nlYZLSJT-YK_DAMvGmmwyOnWFDFfgd”,
  36.     "page": "pages/index/qqq/aaa/aaa?analysisReportId=2050&openId=1",
  37.     "form_id": formId,
  38.     "data": {
  39.       "keyword1": {
  40.         "value": "乐奔快递",
  41.         "color": "#173177"
  42.       },
  43.       "keyword2": {
  44.         "value": "2017年11月13日 12:00",
  45.         "color": "#173177"
  46.       },
  47.       "keyword3": {
  48.         "value": "iPhone11",
  49.         "color": "#173177"
  50.       },
  51.       "keyword4": {
  52.         "value": "12545568461025",
  53.         "color": "#173177"
  54.       },
  55.       "keyword5": {
  56.         "value": "贝贝",
  57.         "color": "#173177"
  58.       }
  59.     },
  60.     "emphasis_keyword": "keyword1.DATA"
  61.   }

  62.   util.httpsPostRequest("https://api.weixin.qq.com/cgi-bin/message/wxopen/template/send?access_token=" + access_token, dic, function (success) {
  63.     console.info('access_tokenerrmsg==' + success.errmsg);
  64.   })
  65. },
复制代码

其余代码:
  1. //表单提交
  2. formSubmit: function (e) {
  3.   if (wx.getStorageSync('isTime') != '') {
  4.     this.data.isTime = wx.getStorageSync('isTime');
  5.     console.log('sync=isTime=', wx.getStorageSync('isTime'));
  6.     console.log('sync=access_token=', wx.getStorageSync('access_token'));
  7.   }

  8.   this.getAccess_token('client_credential', appid, secret, e.detail.formId);
  9. },
  10. countdown: function (that, time) {
  11.   if (time < that.data.timestamp + 60) {
  12.     console.log('=shijiandao=')
  13.     that.data.isTime = true;
  14.     wx.setStorageSync('isTime', that.data.isTime);
  15.     return;
  16.   }
  17.   setTimeout(function () {
  18.     time = time - 1;
  19.     that.countdown(that, time);
  20.   }, 1000)
  21. },
复制代码

.wxml
  1. <!-- 注意点:report-submit必须设为true,才可以拿到其formId -->
  2. <form bindsubmit="formSubmit" bindreset="formReset" report-submit="true">

  3.   <button formType="submit" class="mybtn" type="primary">发送模板消息</button>

  4. </form>
复制代码

回复

使用道具 举报

最佳答案
0 

0

主题

15

帖子

543

积分

略知一二

积分
543
发表于 2017-11-15 14:48:16 | 显示全部楼层
苏州实力互联网企业微信小程序项目招代理,如有有兴趣的话可以V:T77437,
回复 支持 反对

使用道具 举报

您需要登录后才可以回帖 登录 | 立即注册

本版积分规则


易域网-您身边的域名管家

henkuai.com是专业的第三方微信开发者平台,为生态而生。


本站为第三方微信开发者平台,非腾讯官方网站。

天津市滨海新区
中新生态城中成大道生态建设公寓9号楼3层301

欢迎来这里一起喝喝茶,
聊聊你的产品。

微信公众号gongzhongkaifa

工作日12小时内回复。

广告推广
zhongcong@henkuai.com

工作日12小时内回复。

市场合作
songchang@henkuai.com