小程序开发之推送订阅消息

小程序推送消息

本文介绍的是未关联公众号的小程序推送订阅消息的方法，订阅消息会直接推送给微信的“服务通知”这个订阅号。纯前端代码，仅供参考~

订阅消息实现步骤：
1）获取用户的openid和access_token（openid和access_token的获取通常需要后端配合写一个接口，前端调用接口即可~但是我现在测试这个功能所以直接前端都自己实现了）
2）获取模板id：在小程序的后台配置即可（注意：自己申请模板的话需要审核3-7天）
3）获得下发权限：调用wx.requestSubscribeMessage
4）发送订阅消息：调用subscribeMessage.send

需要注意的地方：
1）调用subscribeMessage.send时需要严格遵守小程序对参数值的规定。贴上官方文档https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/subscribe-message/subscribeMessage.send.html

2）对频率的限制：官方对subscribeMessage.send的调用次数进行了限制，次数限制：开通支付能力的是3kw/日，没开通的是1kw/日。

纯前端实现推送订阅消息的代码：

test.html

<button  bindtap="sendMsg">发生订阅消息</button>

我把获取access_token和发送订阅消息都写在一个文件里了，正式写的时候可以分开~把获取access_token写在app.js中或者是单独存放函数的文件中。

test.js

data: {
    access_token:'',
    openid : openid      //提前获取到的openid
  },

  /**
   * 生命周期函数--监听页面加载
   */
  onLoad: function (options) {
  //获取access_token  (openid已经事先获取到了，很简单，官方文档介绍的很清楚了)
    var appid = appid     //小程序后台获取
    var secret = appsecret  //小程序后台获取
    var that = this
    wx.request({
      url: 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential' + '&appid=' + appid + '&secret=' + secret,
      header: {
        'content-type': 'application/json' // 默认值
      },
      success(res) {
        that.setData({
          access_token: res.data.access_token
        })
      }
    })
  },
  //推送订阅消息
  sendMsg:function(){
    var that = this
    wx.requestSubscribeMessage({
      tmplIds: ["模板id],
      success(res) {
        console.log(res)
        if (res["模板id"] === 'accept') {
          console.log('用户同意了')
          wx.showToast({
            title: '订阅OK！',
            duration: 1000,
          })
          wx.request({
            url: 'https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=' + that.data.access_token,
            header: {'content-type': 'application/json'},
            method:'POST',
            data:
              {"touser": that.data.openid,
              "template_id": "模板id",
              "page": "homepage",                  //点击订阅消息以后跳转到的小程序页面
              "miniprogram_state": "developer",
              "lang": "zh_CN",
              "data": {
                  "thing3": {
                    "value": "我是设备"
                  },
                  "character_string4": {
                    "value": "112Q239333"
                  },
                  "thing5": {
                    "value": "中山市人民医院康怡大楼内科3室"
                  },
                  "name2": {
                    "value": "周珊"
                  },
                  "character_string1": {
                    "value": "23231233333"
                  }
                }
            },
            //调用接口成功
            success: function (res) {
              console.log(res);
            },
          });
        }
      },
      fail(err) {
        //失败
        console.error(err);
      }
    })
  },

测试结果：

推送订阅消息到这里就圆满测试结束啦~欢迎提出指正