微信小程序（uniapp）发送订阅消息_uniapp 订阅消息

微信小程序（uniapp）订阅消息通知模板实现指南

在微信小程序开发中，订阅消息是一种重要的用户触达方式，尤其适用于需要主动通知用户的场景，如订单状态更新、活动提醒等。本文将详细介绍如何在 uniapp 中实现订阅消息通知模板，并提供完整的实现思路和代码示例。

一、订阅消息的基本概念

1. 订阅消息的定义
   订阅消息是用户在小程序内主动触发某些操作后，允许小程序在特定时间向用户发送的一次性消息通知。

2. 订阅消息的权限
   用户必须明确同意订阅后，小程序才能发送消息。每次订阅仅对单次触发有效，不能长期订阅。

3. 订阅消息的使用场景
   适用于需要及时通知用户的场景，如订单支付成功、物流状态更新、活动开始提醒等。

二、实现订阅消息通知的步骤

1. 开通订阅消息模板

1. 登录微信公众平台，进入小程序后台。
2. 在“功能” -> “订阅消息”中，添加需要的订阅消息模板。
3. 记录模板ID，后续代码中会用到。
   

2. 调用订阅消息接口

在小程序中，通过 wx.requestSubscribeMessage 接口请求用户订阅消息。

3. 发送订阅消息

后端服务器通过微信提供的接口，向用户发送订阅消息。

三、详细实现步骤

1. 前端代码实现订阅消息请求

在 uniapp 项目中，可以在需要触发订阅消息的页面添加以下代码：

注意：订阅消息方法只能通过点击事件触发，不能直接调用！

<template> <view class=\"container\"> <button @click=\"subscribeMessage\">订阅消息</button> </view></template>

export default { methods: { subscribeMessage() { uni.requestSubscribeMessage({ tmplIds: [\'TEMPLATE_ID_1\', \'TEMPLATE_ID_2\'], // 替换为你的模板ID success: (res) => { console.log(\'订阅成功\', res); if (res[\'TEMPLATE_ID_1\'] === \'accept\') { // 用户同意订阅后，调用后端接口发送消息 uni.request({  url: \'https://xxxxxx.com/sendSubscribeMessage\', // 替换为你的后端接口地址  method: \'POST\',  data: { openid: \'USER_OPENID\', // 需要从登录态中获取用户的openid templateId: \'TEMPLATE_ID_1\', data: {  thing1: { value: \'订单支付成功\' },  time2: { value: \'2023-10-01 12:00\' } }  },  success: (response) => { console.log(\'消息发送成功\', response);  },  fail: (error) => { console.error(\'消息发送失败\', error);  } }); } }, fail: (err) => { console.error(\'订阅失败\', err); } }) } }};

.container { padding: 20px;}button { background-color: #007aff; color: #ffffff; padding: 10px 20px; border-radius: 5px;}

完整代码：

<template> <view class=\"container\"> <button @click=\"subscribeMessage\">订阅消息</button> </view></template> <script>export default { methods: { subscribeMessage() { uni.requestSubscribeMessage({ tmplIds: [\'TEMPLATE_ID_1\', \'TEMPLATE_ID_2\'], // 替换为你的模板ID success: (res) => { console.log(\'订阅成功\', res); if (res[\'TEMPLATE_ID_1\'] === \'accept\') { // 用户同意订阅后，调用后端接口发送消息 uni.request({  url: \'https://your-server.com/sendSubscribeMessage\', // 替换为你的后端接口地址  method: \'POST\',  data: { openid: \'USER_OPENID\', // 需要从登录态中获取用户的openid templateId: \'TEMPLATE_ID_1\', data: {  thing1: { value: \'订单支付成功\' },  time2: { value: \'2023-10-01 12:00\' } }  },  success: (response) => { console.log(\'消息发送成功\', response);  },  fail: (error) => { console.error(\'消息发送失败\', error);  } }); } }, fail: (err) => { console.error(\'订阅失败\', err); } }); } }};</script> <style>.container { padding: 20px;}button { background-color: #007aff; color: #ffffff; padding: 10px 20px; border-radius: 5px;}</style>

2. 后端代码实现消息发送

后端需要使用微信提供的接口发送订阅消息。以下是使用 Node.js 和 axios 的示例：

const axios = require(\'axios\');const sendSubscribeMessage = async (req, res) => { const { openid, templateId, data } = req.body; const accessToken = await getAccessToken(); // 获取access_token的函数，需自行实现 const url = `https://api.weixin.qq.com/cgi-bin/message/subscribe/send?access_token=${accessToken}`; const payload = { touser: openid, template_id: templateId, page: \'/pages/index/index\', // 用户点击消息后跳转的小程序页面 data: data }; try { const response = await axios.post(url, payload); res.json(response.data); } catch (error) { console.error(\'消息发送失败\', error); res.status(500).send(\'消息发送失败\'); }};const getAccessToken = async () => { const appId = \'YOUR_APP_ID\'; const appSecret = \'YOUR_APP_SECRET\'; const url = `https://api.weixin.qq.com/cgi-bin/token?grant_type=client_credential&appid=${appId}&secret=${appSecret}`; const response = await axios.get(url); return response.data.access_token;};module.exports = { sendSubscribeMessage };

3. 获取用户 openid

在发送订阅消息时，需要用户的 openid。可以通过微信登录流程获取：

1. 用户在小程序端调用 wx.login 获取 code。
2. 后端通过 code 调用微信接口获取 openid 和 session_key。

四、注意事项

1. 模板ID的正确性
   确保使用的模板ID与微信后台配置的模板一致。
2. 用户订阅权限
   用户必须明确同意订阅后，才能发送消息。每次订阅仅对单次触发有效。
3. 消息内容规范
   订阅消息的内容需要符合微信的规定，不能包含违规信息。
4. 接口调用频率限制
   微信对获取 access_token 和发送消息的接口有频率限制，需合理规划调用。
5. 错误处理
   在前端和后端都需要做好错误处理，确保用户体验。

五、总结

通过 uniapp 和微信小程序的订阅消息功能，开发者可以实现灵活的消息通知机制，提升用户参与度和活跃度。

动画片大全