微信小程序发送订阅消息(云开发实现)

最近做项目时需要用到订阅消息这个功能,为了实现这一功能,可让我一顿好找啊。查看了众多博客和相关文章,还是没找到比较详细且适合小白的博客,所以在此我整理了一下我自己写的代码,这是对自己的一份总结,也希望可以帮助跟我一样还在路上的朋友。

首先,需要在微信官方文档查看一下实现订阅消息的步骤订阅消息
其次,因为发送订阅消息需要使用到云开发,所以在项目开始先需对项目进行云开发初始化。注意:云函数运行前需要部署,如果你不熟悉云环境的话,还是先创建一个吧,不要创建两个,如果有两个环境更不要两个环境之间切来切去,不然这将是很痛的领悟啊!!!切记切记
好了,下面开始看代码

wxml

<form bindsubmit="order_submit">
  <!-- <view class="title">{{title}}</view> -->
  <input class="title" type="text" value="{{title}}" name="title"></input>
  <view class="time">
    <text>预约时间</text>
    <input type="text" placeholder="请输入预约时间" name="time"></input>
  </view>
  <view class="number">
    <text>用餐人数</text>
    <input type="number" placeholder="请输入用餐人数" name='number'></input>
  </view>
  <view class="name">
    <text>联系人</text>
    <input type="text" placeholder="请输入您的名字" name='name'></input>
  </view>
  <view class="phone">
    <text>联系电话</text>
    <input type="number" placeholder="请输入手机号码" maxlength='11' name='phone'></input>
  </view>
  <view class="note">
    <text>备注</text>
    <input type="text" placeholder="请输入您的备注信息" name='note' maxlength='18'></input>
  </view>
  <button form-type="submit">确定</button>
</form>

js

const app = getApp()
const tmplId = 'EHnKQwB95VJUbehyLeq2dbnQpCM__Z7XbIU_rUfz5h4' //这是订阅消息模板id,需自行申请
order_submit: function (e) {
//这是模板信息
    var message = {
      name: e.detail.value.name,
      content: `餐厅:${e.detail.value.title}`,
      time: e.detail.value.time,
      state: '预约成功',
      phone: e.detail.value.phone
    }
      // 调用微信 API 申请发送订阅消息
      wx.requestSubscribeMessage({
        // 传入订阅消息的模板id,模板 id 可在小程序管理后台申请
        tmplIds: [tmplId],
        success:res => {
          // 申请订阅成功
          if (res.errMsg === 'requestSubscribeMessage:ok') {
            // 这里将订阅的课程信息调用云函数存入db
            wx.cloud
              .callFunction({
                name: 'subscribe',
                data: {
                  message: message
                },
              })
              .then(res => {
                wx.showToast({
                  title: '订阅成功',
                  icon: 'success',
                  duration: 2000,
                });
                console.log('发送成功', res)
              })
              .catch(res => {
                wx.showToast({
                  title: '订阅失败',
                  icon: 'success',
                  duration: 2000,
                });
                console.log('发送失败', res)
              });
          }
        },
        fail:err => {
          console.log(err)
        }
      });
      
    }
  },

云函数subscribe index.js文件

// 云函数入口文件
const cloud = require('wx-server-sdk')

cloud.init({
  env:""//这是云环境id
})

// 云函数入口函数
exports.main = async (event, context) => {
    try{
      const {OPENID} = cloud.getWXContext();
      const result = await cloud.openapi.subscribeMessage.send({
        touser:OPENID,
        page:'pages/index/index',
        data:{
        //这些参数都会在模板详情那有,这些参数不能弄错,一旦弄错就发送不了
          thing1:{
            value:event.message.name
          },
          thing3:{
            value:event.message.content
          },
          time2:{
            value:event.message.time
          },
          phrase4:{
            value:event.message.state
          },
          phone_number6:{
            value:event.message.phone
          }
        },
        templateId:'EHnKQwB95VJUbehyLeq2dbnQpCM__Z7XbIU_rUfz5h4'
      })
      console.log(result)
      return result
    }catch(err){
      console.log(err)
      return err
    }
}

到此就可以实现订阅消息的推送啦
还有就是最近也做了定时发送订阅消息这个功能,就是使用订阅消息、定时触发器和时间轮训机制三者结合实现,在这里也要特别注意的是当在云函数使用了触发器时,在运行项目前部署云函数的同时也要上传触发器 上传触发器 上传触发器,不然实现不了定时发送的效果,这些坑都是我自己一个个踩过来的,希望可以帮助一起同行的朋友吧。

评论 2
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、付费专栏及课程。

余额充值