微信小程序开发之订阅消息

作者: 前端王睿 | 来源:发表于2021-03-18 18:19 被阅读0次

    微信小程序开发中我们常常可能会遇到这样的需求,用户执行某一操作后,需要在未来某一时刻给予用户反馈通知,比如在一些餐厅点餐后发送的取餐提醒,某些打卡应用的打卡提醒,等等。这些都必须在小程序外部给到用户有效的通知,所以实现此功能的方式只有一种——订阅消息

    订阅消息 主要分为两步:订阅发布

    一、订阅

    小程序要发送消息,首先它得知道发送给谁,然后就是该什么时候发送。因此,订阅 是必须要有的操作,就好比公众号,你若想要某个公众号能在每次发布文章时你能收到推送,就必须关注该公众号才行。

    但是,和公众号不同的是,小程序只能实现 一次性消息订阅 而非永久,也就是说你订阅后消息只要发送后该订阅就失效了,以后若想要再次收到消息通知就必须再次订阅。

    订阅消息代码大致如下:

    wx.requestSubscribeMessage({
      tmplIds: [''],   //  需要订阅的消息模板的id的集合
      success (res) { }   //  接口调用成功的回调函数
    })
    

    那么tmplIds数组中的消息模板id在哪获取呢?

    首先我们得先自己去添加配置消息模板,可以在 [微信公众平台(http://mp.weixin.qq.com)-功能-订阅消息] 中配置,配置好消息模板后即可获取其模板ID。

    更多订阅消息的相关细节可以直接前往 微信官方文档·小程序(https://developers.weixin.qq.com/miniprogram/dev/api/open-api/subscribe-message/wx.requestSubscribeMessage.html 查看。

    二、发布

    订阅消息之后,小程序还需要根据订阅时提供的相关信息(用户ID等)来发布消息。

    上面提到的订阅操作是用户操作,体现在前端,也就是小程序端,而发布操作则体现在后端,也就是服务端,这时我们可以直接使用云开发来实现。

    1. 定义云函数

    我们可以定义个发布消息的云函数,代码大致如下:

    const cloud = require('wx-server-sdk')  //  必须先安装wx-server-sdk
    cloud.init({
      env: cloud.DYNAMIC_CURRENT_ENV    //  云环境ID
    })
    exports.main = async (event, context) => {
      try {
        const result = await cloud.openapi.subscribeMessage.send({
            touser: 'OPENID',   // 接收者(用户)的 openid
            page: 'pages/index/index',  // 点击模板卡片后的小程序跳转页面
            lang: 'zh_CN',  //  语言类型
            data: {},  // 模板内容
            templateId: 'TEMPLATE_ID',  // 所需下发的订阅模板id
            miniprogramState: 'developer'  // 跳转小程序类型,默认是正式版
          })
        return result
      } catch (err) {
        return err
      }
    }
    

    具体参数配置可以直接前往微信官方文档·小程序(https://developers.weixin.qq.com/miniprogram/dev/api-backend/open-api/subscribe-message/subscribeMessage.send.html 查看。

    有几个地方可能需要注意:

    ① 上述代码是云函数中的云调用,需要用到wx-server-sdk

    可以通过npm install --save wx-server-sdk@latest进行安装,注意必须安装在当前云函数所在文件目录下。例如:

    wx-server-sdk安装在其中

    更多云调用相关内容详见→微信官方文档·小程序(https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/openapi/openapi.html#%E4%BA%91%E8%B0%83%E7%94%A8

    ② 需在 config.json 中配置 subscribeMessage.send API 的权限
    {
      "permissions": {
        "openapi": [
          "templateMessage.send"
        ]
      }
    }
    

    当然,config.json文件也必须放在当前云函数所在文件目录下。

    ③ 有关subscribeMessage.send API参数data的具体配置
    这是我最近开发的一款小程序用到的消息模板

    就以我开发的 目标管理助手 小程序为例,消息模板我用了4个字段,分别为上图的thing1、thing2、date3、thing4,所以对应的参数data如下:

    cloud.openapi.subscribeMessage.send({
      data: {
        thing1: {
          value: '坚持一个月上班不迟到'
        },
        thing2: {
          value: '你的好友已确认见证'
        },
        date3: {
          value: '2020-01-17 12:30:00'
        },
        thing4: {
          value: '请尽快处理哦'
        }
      },
      //  其他参数...
    });
    

    当然,上面的字段值文字只是示例,可以根据需要自由填写。

    2. 调用云函数

    定义好云函数之后当然还得调用云函数才行,就像我们声明一个函数后得去执行它才能生效一样。

    调用云函数的方式有两种:手动调用自动调用

    ① 手动调用

    手动调用 顾名思义就是需要用户手动触发云函数执行,如果把上面发送消息的云函数命名为sendMessage,那么部署好后我们就可以直接在用户订阅消息成功后调用它了:

    wx.requestSubscribeMessage({
      tmplIds: [''],   //  需要订阅的消息模板的id的集合
      success (res) {    //  接口调用成功的回调函数
    
        wx.cloud.callFunction({   // 调用云函数
          // 云函数名称
          name: 'sendMessage',
          // 传给云函数的参数
          data: {
            openid: ''  // 用户openid
          },
          success: function(res) {
            console.log(res)
          }
        })
    
      }
    })
    

    然后云函数就可以获取到传过来的参数openid

    // ...
    exports.main = async (event, context) => {
      try {
        const result = await cloud.openapi.subscribeMessage.send({
            touser: event.openid,   // 接收者(用户)的 openid
            // 其他参数...
          })
        return result
      } catch (err) {
        return err
      }
    }
    

    云函数接收两个参数:eventcontext,而调用云函数时所传递的参数都保存在event对象中。

    另外,event对象还自带一个userInfo属性,而userInfo属性下保存有小程序的appId和用户的openId,因此你也可以直接通过event.userInfo.openId的方式获取用户的openId

    const result = await cloud.openapi.subscribeMessage.send({
      touser: event.userInfo.openId,   // 接收者(用户)的 openid
      // 其他参数...
    })
    
    ② 自动调用

    自动调用 顾名思义就是可以由程序自动调用而无需用户手动触发,这就需要用到云函数中的 定时触发器 了,通过它可以让云函数按照某个特定的周期不断自动执行。

    a) 在config.json中添加triggers字段

    {
      // triggers 字段是触发器数组,目前仅支持一个触发器,即数组只能填写一个,不可添加多个
      "triggers": [
        {
          // name: 触发器的名字
          "name": "myTrigger",
          // type: 触发器类型,目前仅支持 timer (即 定时触发器)
          "type": "timer",
          // config: 触发器配置,在定时触发器下,config 格式为 cron 表达式
          "config": "0 0 2 1 * * *"
        }
      ]
    }
    

    此处代表在每月的1日的凌晨2点自动触发云函数,也就是发布订阅消息。

    b) 右击config.json选择“上传触发器”

    右键选择上传触发器

    更多定时触发器相关内容详见→微信官方文档·小程序(https://developers.weixin.qq.com/miniprogram/dev/wxcloud/guide/functions/triggers.html


    重点总结

    ① 微信小程序中的订阅消息只能实现一次性订阅,而且必须通过用户手动触发订阅;
    ② 消息发布是通过调用云函数实现的,有手动调用和自动调用两种方式;
    ③ 云函数和定时触发器都必须上传之后才能使用。

    相关文章

      网友评论

        本文标题:微信小程序开发之订阅消息

        本文链接:https://www.haomeiwen.com/subject/axmzqltx.html