小程序推送消息 formId

介绍:小程序的 from_id 要在用户发生操作的时候才能产生,所以我们可以用以下方法来做 (手动触发,保存formID,后台接收保存在数据库里

什么是formId

formId是小程序可以向用户发送模板消息的通行证,简单而言,你只有获取到formId,把它交给后台,后台同学才能向用户发送通知消息,而这个通行证的有效期只有七天。这是微信为了防止小程序滥用通知消息骚扰用户而提出的一种策略。

如何获取formId

小程序的消息文档告诉我们,获取formId有以下两种途径:支付和提交表单。用户支付一次,可获得3个formId,用户提交表单一次可得到一个formId。如果你的小程序中没有支付行为,需求又需要向用户发送消息时,你就只能依靠提交表单了。

form和form-type

小程序中有个组件叫做form。这个组件平常没什么用,说实话,在搜集formId之前,我还真没有注意过它,但是谁让它是formId的生产者呢,我们需要给用户发消息时,就很有必要了解一下了。

form组件有个属性叫report-submit当在标签中加入这个属性时,一旦表单提交,submit回调中就可以拿到formId了。

一般的获取formID 方法:

wxml:

<form bindsubmit='submitInfo'  report-submit='true'>
    <button form-type="submit">自定义按钮</button> // 此处我们可以定义一些即将要触发的事件的样式
</form>

wx.js:

Page({
    submitInfo: function (e) {
        // 这样我们就可以获取到form_id了
        console.log(e.detail.formId);  
    }
})

如何在mpvue下收集小程序的formId 

看段代码:

// mpvue
  
<form report-submit @submit="uploadFormId">
   <button form-type="submit"> 查看/分享/首页/支付</button>
</form>  


submitInfo(e) {
   console.log(e, e.mp.detail)
},

获取尽可能多的formId

从运营的角度而言,formId肯定是越多越好。所以每一个页面上用户的每一次点击我们都巴不得触发一次表单提交。哪怕从界面上讲,这次点击可能是跳转,弹窗的功能,跟表单完全无关,都要把button放在一个form中。但是这样无疑增加了前端的工作量,因为需要为每个页面的submit事件绑定一个上传formId的方法。一个可行的方法是借助vue的mixin,为每一个页面实例混入一个上传formId的方法:

  // app.js
    Vue.mixin({
      methods: {
        uploadFormId (e) {
          this.req({
            url: '/api/v1/formid?formId=' + e.target.formId
          })
        }
      }
    })

另外一个方法:

function _collectWeChatFormId(formId) {
  let token = wx.getStorageSync("token_/cookies"), openId = wx.getStorageSync("openid_cookies"), orign = 1;
  console.log('formId',formId)
  if (formId == 'the formId is a mock one') {
    console.log(`模拟器中运行!`)
    return false;
  } if (formId.length == 0) {
    console.log(`formId不能为空`)
    return false;
  }
  let site = '你的收集接口',
    dates = {
      token: token,
      openId: openId,
      formId: formId,
      orign: orign
    },
    md = 'token=' + token + '&openId=' + openId + '&formId=' + formId + '&orign=' + orign;
  requestHttp(site, dates, md, function (res) {
    console.log(res)
    console.log(res.data)
  })
}

猜你喜欢

转载自blog.csdn.net/zhan_lijian/article/details/87376676
今日推荐