微信小程序从0到实现发送订阅消息完整版——带你脱坑

废话不多比比,在开发微信小程序进行消息推送时遇到了麻烦 耽搁了一下午 ,所以把这些麻烦都记录一下 希望对你也有用

微信小程序从0到实现发送订阅消息完整版——带你脱坑_第1张图片
根据微信小程序官方文档的提示我们的模板消息在2020 年 1 月 10 号全面下架,所以要实现功能我们就要开通订阅消息

踩坑一设置服务类目

在我第一次进入订阅消息模块时,让我点击开通订阅消息 当我点击开通按钮 提示让我微信后台设置服务类目

点击设置中 完善小程序信息后 可查看自己的服务条目是否有 有的话再次进入订阅消息中即可开通使用
微信小程序从0到实现发送订阅消息完整版——带你脱坑_第2张图片
ps:订阅消息模块中可以自定义消息模板 但是需要审核3-7天 建议在公共模板库中查询自己想要的模板点击选用 可以我就不详细使用过程了 很简单 类似之前我们的模板消息

踩坑二wx.requestSubscribeMessage使用失败,一直不弹框?

微信小程序从0到实现发送订阅消息完整版——带你脱坑_第3张图片
检查你的基础库版本 一定要设置为高版本 低版本的有点在多条权限时只显示一条 有的直接导致不弹窗 这里建议设置为最新的

踩坑三 多个权限申请 弹窗只显示单条记录 且弹窗体于小程序开发文档不一致

我设置好的弹窗体:
微信小程序从0到实现发送订阅消息完整版——带你脱坑_第4张图片
微信开发文档的弹窗体:
微信小程序从0到实现发送订阅消息完整版——带你脱坑_第5张图片
请检查你的真机调试的版本是否为最新版本 我的不是 当我更新好之后就显示成功了
最最重要的代码实现来了

//权限弹窗代码
const tmplId = 'rV_13VS_fEQONMZ01D4YOTKDnM8SpQiEFYYqFM-RA1s'
      wx.requestSubscribeMessage({
        tmplIds: [tmplId],//tmplIds为我们订阅消息模块中申请的模板id
        success(res) {
          if (res[tmplId]=='accept'){
            wx.showToast({
            title: '授权成功',
           })
          }   
        }
      })

微信小程序从0到实现发送订阅消息完整版——带你脱坑_第6张图片
以及我们点击授权过后打印的res中的数据(下图为申请2个订阅消息时都允许和只允许一次的结果)
微信小程序从0到实现发送订阅消息完整版——带你脱坑_第7张图片
完整代码:
云函数index.js的代码

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

cloud.init()

// 云函数入口函数
exports.main = async (event, context) => {
  try{
  //templateId 订阅消息模块id
    const templateId = 'rV_13VS_fEQONMZ01D4YOTKDnM8SpQiEFYYqFM-RA1s'
    const wxContext = cloud.getWXContext()
    const result = await cloud.openapi.subscribeMessage.send({
      touser: wxContext.OPENID,
      page: `/pages/blog-comment/blog-comment?blogId=${event.blogId}`,//查看的页面
      data: {
      //这里的参数时我们订阅消息模块中要显示的数据 也可以在小程序中通过传参的方式进行动态赋值 我这里写死了
      //参数名称详情看下图
        phrase1: {
          value: '评价成功'
        },
        thing2: {
          value: '弟弟救我啊'
        }
      },
      templateId: templateId,

    })
    console.log(result)
    return result


  }catch(err){
    console.log(err)
    return err
  }
 
  
}

这里根据你选择的详细内容名称
微信小程序从0到实现发送订阅消息完整版——带你脱坑_第8张图片
config.json

{
  "permissions": {
    "openapi": [
      "subscribeMessage.send"
    ]
  }
}

小程序中页面的调用

  onSend(){
     
       if(this.data.content.trim()==''){
          wx.showModal({
            title: '评论内容不能为空',
            content: '',
          })
          return
       }

      const tmplId = 'rV_13VS_fEQONMZ01D4YOTKDnM8SpQiEFYYqFM-RA1s'
      wx.requestSubscribeMessage({
        tmplIds: [tmplId],
        success(res) {
          if (res[tmplId]=='accept'){
            wx.cloud.callFunction({//调用云函数
              name: 'messageSend',//你的云函数名称

            }).then((res) => {
              wx.showToast({
                title: '完成',
              })
            })
          }
         
        }
      })
      }

微信小程序从0到实现发送订阅消息完整版——带你脱坑_第9张图片
ok这就完成了订阅消息的集成
以及如果你的微信小程序之前使用过模板消息集成推送 如果运行还是报 模板消息在2020 年 1 月 10 号全面下架请移步微信官方文档等错误时 请检查你的wxml代码 将你的form标签还原到之前的标签就可以了

你可能感兴趣的:(微信云开发)