【微信小程序】 通过用户登录实现批量收集formId

参考网上多篇文章，本文目的旨在做个记录。

【微信小程序】通过用户登录实现批量收集formid，无限次发送模板消息

提交1次表单可下发1条模板消息，多次提交下发条数独立，相互不影响。
所以，想无限次发送模板消息，需要批量的收集formId。

index.wxml

<view>
<view class="inputView" style="margin-top: 10% ">
<form bind:submit="formSubmit" report-submit="true">
<button form-type='submit' class='form_button'>
<view class='vv'>
<form bind:submit="formSubmit" report-submit="true">
<button form-type='submit' class='form_button'>
<view class='vv'>
<input class="input" type="string" bindinput='username' placeholder="用户名" placeholder-style="color: #FFFFFF" />
</view>
</button>
</form>
</view>
</button>
</form>
</view>
<view class="inputView" style="margin-top: 5% ">
<form bind:submit="formSubmit" report-submit="true">
<button form-type='submit' class='form_button'>
<view class='vv'>
<form bind:submit="formSubmit" report-submit="true">
<button form-type='submit' class='form_button'>
<view class='vv'>
<input class="input" password="true" bindinput='pwd' placeholder="密码" placeholder-style="color: #FFFFFF" />
</view>
</button>
</form>
</view>
</button>
</form>
</view>
<form bind:submit="login" report-submit="true">
<button type='default' formType="submit" class='btn'>绑定</button>
</form>
</view>

index.js

formSubmit:function(e){
let formId = e.detail.formId; //获取formId
console.log(formId)
if (e.detail.formId != 'the formId is a mock one') {
this.collectFormIds(formId);//保存推送码
}
},
collectFormIds: function (formId) {
let formIds = app.globalData.globalFormIds; // 获取全局推送码数组
if (!formIds)
formIds = [];
let data = {
formId: formId,
expire: new Date().getTime() + 604800000 // 7天后的过期时间戳
}
formIds.push(data);// 将data添加到数组的末尾
app.globalData.globalFormIds = formIds;// 保存推送码并赋值给全局变量
},
username:function(e){
this.data.username = e.detail.value
},
pwd:function(e){
this.data.pwd = e.detail.value
},
login: function (e) {
let username = this.data.username;
let pwd =  this.data.pwd;

wx.request({//通过网络请求发送用户名和密码到服务器
url: '请求的地址'’,
data:{
username : username ,
pwd : pwd
},
success: function (res) {
if (res.data.user != null) {
wx.setStorageSync("userId", res.data.user.id) //保存返回的用户信息
}
if (res.data.status == 0) {
//登录成功
wx.redirectTo({
url: '../second/second',
success: function (res) {
console.log('登录跳转成功')
},
fail: function () {
console.log('登录跳转失败')
}
})
} else {
//跳回首页
wx.redirectTo({
url: '../index/index',
success: function (res) {
console.log('跳回首页成功')
},
fail: function () {
console.log('跳回首页失败')
}
})
}
}
})
}

second.js

Page({
onLoad: function (options) {
this.uploadFormIds(); //上传推送码
},
uploadFormIds: function () {
var openid = wx.getStorageSync("openid")//获取openid
var userId = wx.getStorageSync("userId")//获取userId
var formIds = app.globalData.globalFormIds;// 从全局变量中获取formId
if (formIds) {//gloabalFomIds存在的情况下 将数组转换为JSON字符串
formIds = JSON.stringify(formIds);
app.globalData.globalFormIds = '';   //清空formId
}
if (userId){
wx.request({//通过网络请求发送openId和formIds到服务器
url: '请求地址',
method: 'POST',
data: {
formId: formIds,
openId: openid,
userId: userId
}
success: function (res) {
}
})
}
}
})

后台将获取到的 fromId，openid，以及userid 保存到数据库表中，就实现了批量收集formId的功能。

注：测试时，必须在真机上测试，微信开发者工具收集不到fromId，提示：the formId is a mock one
注：真机测试时，手机和电脑连的WIFI是同一个。
注：测试时，调用本地的接口，可以在微信开发者工具中设置成不检验合法域名，如下图