微信小程序开发之实现订阅消息发布功能

本文主要详细介绍关于微信小程序的消息订阅功能的开发流程,尽可能详细的进行分析开发,使之成为一篇具有参考意义的文章。

自从微信官方取消了模板消息,订阅消息逐步出现在大众的视野。大家如果想了解一下 模板消息 和 订阅消息他们直接的区别,可以看一下这篇文章 微信小程序可以向用户推送消息吗? 当然看不看都无所谓,因为模板消息已经彻底再见了。我们还是多关注关注我们的订阅消息吧。

在这里,先提供几个官方的参考文档:
小程序订阅消息
小程序端消息订阅接口 wx.requestSubscribeMessage
服务端消息发送接口 subscribeMessage.send

好了,废话不多说,进入正题。


一、什么是订阅消息

订阅消息就是需要用户主动订阅,开发者才能面向这些用户发送消息。
微信小程序开发之实现订阅消息发布功能_第1张图片

主要内容:

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

订阅消息类型:

  • 一次性订阅消息:该类型主要用于解决使用小程序后,后续服务环节的通知问题。用户自主订阅后,开发者可不限时间地下发一条对应的服务消息;每条消息可单独订阅或退订。
  • 长期订阅消息:对于部分业务场景,一次性订阅消息是不能够满足小程序的需求的,为了便于服务,提供了长期性的订阅消息,用户一开始订阅一次后,开发者可以长期下发多条消息给用户。

    目前长期性订阅消息仅向政务民生、医疗、交通、金融、教育等线下公共服务开放,后期将逐步支持到其他线下公共服务业务。

二、如何实现订阅消息

微信小程序实现订阅消息发送一共需要分为三步来实现:

步骤一:获取订阅消息模板 ID

在微信公众平台手动配置获取模板 ID:
登录 https://mp.weixin.qq.com/wxamp/newtmpl/mytmpl?start=0&limit=10&token=30714040&lang=zh_CN 获取模板,如果没有合适的模板,可以申请添加新模板,审核通过后可使用。

微信小程序开发之实现订阅消息发布功能_第2张图片

步骤二:获取小程序的订阅消息下发权限

在我们发送小程序的订阅消息之前我们需要用户自己来决定是否需要接受到订阅消息,以及是否选择 “总是保持以上选择,不再询问” 选项。
注意:用户勾选 “总是保持以上选择,不再询问” 之后,下次订阅调用 wx.requestSubscribeMessage 不会弹窗,保持之前的选择,修改选择需要打开小程序设置进行修改。

实现方法:wx.requestSubscribeMessage(Object object)

wx.requestSubscribeMessage({
  tmplIds: ['MUtLwsw0xCndRULTgNHiXwGDyHJ-xx'],  // 模板ID
  success (res) { 
  	// 成功的回调
  	console.log(res)
  }
})

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

当用户同意接受订阅消息,实现第三步之后就可以接收到订阅消息了,如果用户拒绝接收的话,即使执行完第三步用户也不会接收到订阅消息。

调用下发订阅消息接口

小程序端代码:

// index.wxml 
<button bindtap="sendMessage">发送订阅消息</button>

// index.js
// 点击发送订阅消息
sendMessage: function(e) {
	wx.request({
		url: 'https://xxx/xx/sendMessage', 
		method: 'POST',
		data: { },
		success(res) {
			console.log(res)
		}
	})
}

定义发送订阅消息接口

这部分内容主要是在服务端进行调用,具体使用请移步至 服务端消息发送接口 subscribeMessage.send 微信官方文档进行查看。

在这里主要介绍一下里面的几个重点关注的内容:

  • 调用方式:HTTPS 调用 和 云调用
    在这里主要用到的是 HTTPS 调用,在上面的文档中也有介绍 云调用 的整体开发。
  • 请求地址:
    POST https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=ACCESS_TOKEN
  • 请求参数:
    access_token:接口调用凭证(这个凭证还是很重要的,不了解的小伙伴欢迎移步 官网 查看)
    touser:接收者(用户)的 openid
    template_id:所需下发的订阅模板id
    data:模板内容
  • 返回值
    Object, 返回的 JSON 数据包

服务端(nodejs koa2)代码实例:

// index.js
const router = require('koa-router')()
const request = require('superagent')
let AppID = 'xxxxx'
let AppSecret = 'xxxxx'
let access_token = 'xxxxx'
let openid = 'xxxxx'

// 点击发生订阅消息
router.post('/xx/sendMessage', async (ctx, next) => {
    let requestData = {
        "touser": openid,
        "template_id": "MUtLwsw0xCndRULTgNHiXwGDyHJ-xx",
        "page": "index",
        "data": {
            "phrase1": {
                "value": "王小二"
            },
            "date5": {
                "value": "2019年10月1日 15:01"
            },
            "phrase4": {
                "value": "王老师"
            }
        }
    }

    // 2、发送模板消息
    let res = await request
        .post(`https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=${access_token}`)
        .send(requestData)
        .set('Accept', 'application/json')

    console.log(res)

    ctx.body = {
        code: '200',
        data: null,
        msg: '操作成功'
    }
})

总结

至此,通过上面这三个步骤,基本上就可以实现订阅消息发布的功能了,上面的部分代码我只是截取了一部分,但是一些重要的代码以及流程全部正常,感兴趣的朋友可以亲自试一下,有任何问题欢迎评论区留言讨论。

你可能感兴趣的:(小程序系列,NodeJs系列,前端,小程序,接口,javascript,node,node.js)