评论功能与订阅消息推送的实现

一、评论

主要我们第一需要做的，就是将我们的评论内容合适的推送进入云数据库当中

和之前类似，我们需要专门的一个评论的集合来存放内容。主要是存放用户评论内容、暱称、头像、时间的内容

首先先要获取到用户输入的内容

通过我们微信自带的函数来获取用户输入信息

    onInput(event){
      this.setData({
        content:event.detail.value
      })
    },

之后就是上传数据库的过程。

 onSend(){
      //插入云数据库（评论信息,用户信息，评价时间）
      let content=this.data.content
      if (content.trim()=='') {
        wx.showModal({
          title: '评论内容不可为空',
        })
        return
      }
      wx.showLoading({
        title: '评价中',
        mask:true,
      })
      db.collection('blog-comment').add({
        data:{
          content,
          createTime:db.serverDate(),
          blogId:this.properties.blogId,//博客ID
          nickName:userInfo.nickName,//暱称
          avatarUrl:userInfo.avatarUrl//头像
        }
      }).then((res)=>{
        wx.hideLoading()
        wx.showToast({
          title: '评论成功',
        })
        this.setData({
          modalShow:false,
          content:'' //弹窗消失，清空评论框的内容
        })
      })
    },

连接数据库，除了获取用户输入，判断是否为空之外，其余的逻辑其实与发布类似。也没什么新的东西出现。

二、订阅消息

云调用：基于云函数调用服务端的一些接口功能。
在订阅消息中，微信给提供了两种方式：API调用和云函数调用

因为模板消息已经取消，但是订阅消息还不是很友好。所以有很多小问题。

首先就是调用模板库。位置为微信公众平台——订阅消息（原来的模板消息已经不可用，全部切换到了订阅消息中）——添加——选择合适的模板设置即可

返回代码新建一个对应的云函数，配置对应的config.json

之后就是修改我们的云函数，订阅消息和之前的模板其实是有很多不同的。
具体步骤可以查看文档

https://developers.weixin.qq.com/miniprogram/dev/framework/open-ability/subscribe-message.html

首先就是在多了一个步骤，我们需要在设置好模板信息之后，询问用户是否订阅消息，如果不订阅消息是无法推送的。

那么先设置云函数

exports.main = async (event, context) => {
  try {
    const WXContext = cloud.getWXContext()
    const result = await cloud.openapi.subscribeMessage.send({
      touser: WXContext.OPENID, //获取OPENID
      page: `/pages/blog-comment/blog-comment?blogId=${event.blogId}`, //用户点击会打开的界面
      lang: 'zh_CN',
      data: {
        thing3: {
          value: event.content
        },
        phrase2: {
          value: '一条新评价'
        },
        time1: {
          value: event.createTime
        }
      },
      templateId: '5LlPt7U4CNFnoje1ezPUJ9yeJcLv2LjnMdBw24ADqi8', //模板ID
      miniprogramState: 'developer'
    })
    return result
  } catch (err) {
    console.log(err)
    return err
  }
}

这里需要注意的地方是订阅消息使用的是subscribeMessage。另外一个就是我们data中的模板值。千万千万要看文档，千万千万，否则真的会出很多问题。我在调试中就是吃了不少这种问题的哭。订阅消息对于每个值都是做了规定的，类型不匹配就会卡你很久。

接下来就是先询问用户是否订阅了云函数，没有订阅的话需要订阅。这个也有问题，根据小程序文档写的内容，我们只有在点击触发事件时才可以调出订阅消息模板，否则是无效的，还会报错。
所以我将它放在了发布评论的时候，其实订阅功能更应该是放在页面加载的时候，更合理。

 wx.requestSubscribeMessage({
        tmplIds: [templateId],
        success(res) {
          if (res[templateId] == 'accept') {
            wx.showToast({
              title: '订阅成功',
            })
          } else {
            wx.showToast({
              title: '订阅失败',
            })
          }
        },
        fail(err) {
          console.log(err)
        }
      })

这里需要注意的地方是tmplIds获取到的值时array类型，不是string类型。
在判断没有问题，用户发表的评论插入数据库的时候，我们按照订阅消息推送过去，绑定对应的值得信息

 wx.cloud.callFunction({
          name: 'tuiMessage',
          data: {
            content,
            blogId: this.properties.blogId,
            createTime:createTime
          }
        }).then((res) => {
          console.log(res)
        })


        wx.hideLoading()
        wx.showToast({
        title: '评论成功',
        })
        this.setData({
          modalShow: false,
          content: '' //弹窗消失，清空评论框的内容
        })
      })

    },
  },

在这个地方有发现一个问题，就是获取的事件，不能获取服务器端时间，因为文档中写的，只能在调用云数据库的时候，才可以使用“serverdata()”这个方法获取时间。所以我使用了另外一个方法获取的时间data.now()，并且使用之前的格式化时间函数将时间变为符合规范要求的时间格式。