uniapp微信小程序订阅消息发送服务通知–超详细

本文介绍: uniapp 微信小程序订阅消息发送服务通知

由于公司需求，刚学完的小程序的我，要求开发一个直播通知的微信小程序，学了vue的我，选择还是使用 uniapp 开发，wx 原生语法学完已经快忘了。在利用 uniapp写代码的过程中，遇到很多问题，通过这篇博客分享一下总体实现思路以及一些小坑。整篇博客以逐步的思路让你完整的了解整个流程，以及自己该如何编写属于自己的请求方式。一步步跟着来一定可以实现最终效果。

首先要实现这个需求，最直接的办法就是去wx的官方文档中搜索相关文档以及API介绍，在wx小程序官方文档中搜索订阅消息即可看到小程序订阅消息的介绍

在这里插入图片描述

订阅消息可以分为以下几种

1. 一次性订阅消息

一次性订阅消息用于解决用户使用小程序后，后续服务环节的通知问题。用户自主订阅后，开发者可不限时间地下发一条对应的服务消息；每条消息可单独订阅或退订。

2. 长期订阅消息

一次性订阅消息可满足小程序的大部分服务场景需求，但线下公共服务领域存在一次性订阅无法满足的场景，如航班延误，需根据航班实时动态来多次发送消息提醒。为便于服务，我们提供了长期性订阅消息，用户订阅一次后，开发者可长期下发多条消息。

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

3. 设备订阅消息

设备订阅消息是一种特殊类型的订阅消息，它属于长期订阅消息类型，且需要完成「设备接入」才能使用。

设备订阅消息用于在设备触发某些需要人工介入的事件时（例如设备发生故障、设备耗材不足等），向用户发送消息通知。详见设备订阅消息文档。

这里根据自己的需求去选择就好了，一般都是一次性订阅消息，根据官网文档我针对细节做一个补充

在我上面提到的微信官方文档中，步骤和我是一样的，在那里可以进入详情页进入查看详细的步骤。以及接口回调参数对应的信息，示例代码是wx原生代码的，这里我用 uniapp的举例。在文档中，发起弹窗的请求方法为wx.requestSubscribeMessage(Object object)，在uni中搜索此方法为：uni.requestSubscribeMessage(Object object)，完全是一样的，只是调用的顶级对象不一样。

methods:{
	Subscribe(){
		uni.requestSubscribeMessage({
			//此处填写刚才申请模板的模板ID
		  	tmplIds: ['ZcsAH2vJKgKocfQw8e2Phhz-8FzPQgfT_5ehxwic4ck'],
		  	success (res) {
		  		console.log(res)
		  	}
		})
	}
}

请求地址：POST https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=ACCESS_TOKEN

这里需要向wx的一个接口发送请求，需要传入appid和secret，此步用来获取 access_token，有效期为2小时

get_wx_access_token() {
	   return uni.request({
	       method: 'get',
	       // appip和secret需要去小程序管理界面查看
	       url: `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&amp;appid=${appid}&amp;secret=${secret}`,
	       dataType: 'json',
	       timeout: 30000
	   }).then(res =&gt; {
	       let [err, success] = res
	       if (success.statusCode == 200) {
	           return success.data.access_token
	       }
	   })
}

// 先让用户登录，此user_login方法可以放到onLoad()生命周期中去执行
// 此处async和await异步操作不懂可以先百度，问题不大
async user_login() {
		let self = this
		await uni.login({
			success(res) {
				if (res.code) {
					self.code = res.code
				} else {
					console.log('获取失败！' + res.errMsg)
				}
			}
		})
},

// wxappid wxsecret为小程序的appId和secretKey，登录小程序后台可查看，code就是user_login的那个code
uni.request({
	url: `https://api.weixin.qq.com/sns/jscode2session?appid=${wxappid}&amp;secret=${wxsecret}&amp;js_code=${code}&amp;grant_type=authorization_code`,
	success(data) {
		self.useropenId = data.data.openid
	}
})

notice() {
		let self = this
		//下方的thing1，thing2和其他，对应的是你选取模板的模板详情中的字段名称(可在小程序后台模板查看对应的字段，要和上面的字段一样)，需要更改成你自己的
		const pushmsg = {
			"touser": self.useropenId,
			"template_id": "ZcsAH2vJKgKocfQw8e2Phhz-8FzPQgfT_5ehxwic4ck",
			"data": {
				"thing1": {
					"value": "今天记得写代码"
				},
				"date2": {
					"value": "19:00"
				},
				"time3": {
					"value": "20:00"
				},
				"thing4": {
					"value": "今天写堆排序把"
				},
				"time7": {
					"value": "18:50"
				}
			}
		}
		uni.request({
			// 此处的mytoken
			url: 'https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=' + this.get_wx_access_token(),
			data: JSON.stringify(pushmsg),
			method: 'POST',
			success: function(res) {
				// console.log('success');
			}
		})
},