官方消息:小程序模板消息接口将于2020年1月10日下线,开发者可使用订阅消息功能。

功能介绍

消息能力是小程序能力中的重要组成,我们为开发者提供了订阅消息能力,以便实现服务的闭环和更优的体验。

  • 订阅消息推送位置:服务通知
  • 订阅消息下发条件:用户自主订阅
  • 订阅消息卡片跳转能力:点击查看详情可跳转至该小程序的页面

步骤一:获取模板 ID

在微信公众平台手动配置获取模板 ID:

登录 https://mp.weixin.qq.com 获取模板,如果没有合适的模板,可以申请添加新模板,审核通过后可使用。

微信小程序消息订阅 Java详细步骤 小程序订阅消息实例_下发权限

步骤二:获取下发权限

setAuthorization () {
  return new Promise((resolve, reject) => {
    wx.requestSubscribeMessage({
      tmplIds: ['FSwmRTbgz5by1sNZwtr6mpTSAPmVyLJurpQ_qlHgSB4'],
      success (res) {
        console.log('success', res)
        resolve(res)
      },
      fail (err) {
        console.log('fail', err)
        reject(err)
      }
    })
  })
},

获取下发权限的弹框:

微信小程序消息订阅 Java详细步骤 小程序订阅消息实例_订阅消息_02

点击按钮事件,判断是否调用下发订阅消息。

async getCoupons () {
  let result = await this.setAuthorization()
  if (result['FSwmRTbgz5by1sNZwtr6mpTSAPmVyLJurpQ_qlHgSB4'] === 'accept') {
    wx.showToast({
      title: '订阅 OK 啦!',
      duration: 1000,
    })
    this.testSubmit()
  } else {
    wx.showModal({
      title: '温馨提示',
      content: '您已拒绝授权,将无法在微信中收到简历审核通知!',
      showCancel: false,
      success (res) {
        if (res.confirm) {
          // 这里可以写自己的逻辑
        }
      }
    })
  }
},

步骤三:调用接口下发订阅消息

subscribeMessage.send : 本接口应在服务器端调用。这里演示的是在客户端模拟下发订阅消息。

testSubmit: function (e) {
  var self = this;
  var _access_token = self.data.access_token
  var opeid = self.data.openid
  let url = 'https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=' + _access_token

  let jsonData = {
    access_token: _access_token,
    touser: opeid,
    template_id: 'FSwmRTbgz5by1sNZwtr6mpTSAPmVyLJurpQ_qlHgSB4',
    page: "pages/logs/logs",
    data: {
      "thing7": { "value": "互联网大会科学技术", "color": "#173177" },
      "thing4": { "value": "双人海鲜自助餐", "color": "#173177" },
      "thing3": { "value": "2019年11月1日", "color": "#173177" },
      "thing2": { "value": "全场通用", "color": "#173177" },
      "thing8": { "value": "请在有效期内使用", "color": "#173177" },
    },
    miniprogram_state: 'developer',
  }
  wx.request({
    url: url,
    data:jsonData,
    method: 'POST',
    success (res) {
      console.log("***" + JSON.stringify(res))
      if (res.data.errcode === 0) {
        wx.showToast({
          title: '通知成功',
        })
      }
    },
    fail (err) {
      console.log('request fail ', err);
    },
  })
},

值 说明  最低版本

40003 touser字段openid为空或者不正确 

40037 订阅模板id为空不正确 

43101 用户拒绝接受消息,如果用户之前曾经订阅过,则表示用户取消了订阅关系 

47003 模板参数不准确,可能为空或者不满足规则,errmsg会提示具体是哪个字段出错  

41030 page路径不正确,需要保证在现网版本小程序中存在,与app.json保持一致 

更多消息,请参考 小程序订阅消息 官网。

如果下发订阅消息成功回返回 {"errcode":0,"errmsg":"ok"},这是手机中的服务通知会收到刚刚你发送的推送消息。

微信小程序消息订阅 Java详细步骤 小程序订阅消息实例_下发订阅消息_03

在调用接口下发订阅消息时,我们会传递两个参数 access_token 和 opeid,这两个是如何获取到的呢?

接口调用凭证 auth.getAccessToken

获取小程序全局唯一后台接口调用凭据(access_token)。

https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/access-token/auth.getAccessToken.html

getAccessToken () {
  var that = this;
  var appdid = '小程序的appId';
  var appsecret = '小程序密钥'
  var url = 'https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=' + appdid + '&secret=' + appsecret;
  wx.request({
    url,
    success (res) {
      that.setData({
        access_token: res.data.access_token
      })
    }
  })
},

登录 auth.code2Session

登录凭证校验。通过 wx.login 接口获得临时登录凭证 code 后传到开发者服务器调用此接口完成登录流程。

getOpenId () {
  let that = this;
  wx.login({
    success (res) {
      // 使用 wx.login 的 code 换取 openid 和 session_key 等
      let appId = '小程序的appId';
      let secret = '小程序密钥';
      let code = res.code;
      wx.request({ 
        url: 'https://api.weixin.qq.com/sns/jscode2session?appid=' + appId + '&secret=' + secret + '&js_code=' + code + '&grant_type=authorization_code',
        data: {},
        success (resp) {
          that.setData({
            openid: resp.data.openid
          })
        },
        fail (err) {
          console.log('获取 openid 失败', err)
        }
      })
    }
  })
}