【原创】给文章加入小程序验证码解锁（WP Mini Password）隐藏内容的插件开发

这是一个完全由AI做出来的工具，博主加入了自己的想法，全站固定一张微信小程序码；用户扫码看完激励视频广告后领取一次性验证码（全站通用），在文章里输入即可展开隐藏内容。使用微信小程序云开发，无需服务器，自带防盗刷限制。

先说下它的名字：WP Mini Password

先看插件设置截图

小程序界面截图

由于博主使用的是子比主题 编辑器用的是古腾堡 所以在此基础上开发的 使用其他编辑器可能会无法使用

搭建教程

WordPress + 微信小程序：扫码看广告领验证码（云开发版）

先说WordPress的步骤

1. 安装

把 wp-mini-password/ 整个文件夹传到 /wp-content/plugins/（或后台上传 wp-mini-password.zip），启用。

启用时会自动建一张 wp_wmp_codes 表存验证码，注册一个每天清理过期记录的定时任务，并自动生成一串云函数密钥。

2. 配置（设置 → 小程序验证码解锁）

页面从上到下四块：

① 小程序码（全站固定一张）

• 填好 AppID / AppSecret 之后，点 生成 / 重新生成小程序码
• 小程序还没上线时，先把下面的「小程序码版本」改成「体验版」，否则生成的码扫不开
• 点 运行连接自检 —— 会一次测完 access_token、REST 接口、密钥、并用真实签名打一遍 /claim。小程序报错时先跑这个，能直接把问题范围切到「站点侧」还是「小程序侧」

② 云函数接入

• 页面上会显示两行，原样复制到云开发控制台的云函数环境变量里：
• 「重新生成密钥」会换一把新的，换完必须同步更新云函数环境变量，否则小程序立刻报签名校验失败

③ 微信小程序配置

• AppID / AppSecret：微信公众平台 → 开发管理 → 开发设置
• 验证码有效期：默认 300 秒
• 验证码位数：4 – 12 位。想做成「4 位纯数字」就填 4
• 验证码字符集：纯数字 / 数字+大写字母 / 纯大写字母。选「纯数字」即可
• 直连兜底校验：默认开启，作为云函数不可用时的退路（走这条路才需要配 request 合法域名）
• 前端接口地址覆盖：留空即可，只有网页前端的解锁请求访问不到 /wp-json/ 时才需要填

位数和字符集一改，设置页会实时算出组合数。组合数少于 10 万时，/verify 的每 IP 限流会自动收紧（4 位纯数字 → 3 次/分钟），把「有效期内被猜中」的概率压在 1% 以内。6 位字母数字组合数约 8.9 亿，限流保持 20 次/分钟不变。

改动只影响之后新发的码，已经发出去还没用掉的旧码照旧有效。

④ 解锁模块外观：模块标题、提示文字、小程序码尺寸、区块分类、是否记住已解锁状态

⑤ 解锁状态保留时长：用户解锁后多久需要重新领码。默认 1 天，可选 30 分钟 / 1 小时 / 6 小时 / 12 小时 / 1 天 / 7 天 / 不记住。

用户解锁后，展开的内容会连同到期时间一起记在浏览器本地。到期后刷新页面会重新锁上；页面一直开着不刷新时，也会由定时器到点自动收起内容，并提示「解锁已到期，请重新获取验证码」。

设得越短，用户需要重新看广告的次数越多；设得太长，一个人解锁一次就能白看很久。取消勾选「记住已解锁状态」则每次刷新都要重新输。

3. 在文章里插入解锁模块

古腾堡编辑器 → 点 + 插入区块 → 找到 验证码解锁（会出现在 Zibll 区块分类下）。

隐藏内容直接放在区块内部，可以塞段落、图片、表格、代码块——任何古腾堡区块都行。

右侧边栏可以单独调这个区块的标题、提示文字、小程序码尺寸；不填就用设置页里的全局默认值。

再说小程序端的步骤

1. 导入

微信开发者工具 → 导入项目 → 选 miniprogram/ → 填自己的 AppID（project.config.json 里的 appid 也要改）。

2. 改配置（只需改 config.js）

有多个云环境时，cloudEnv 必须填成要用的那个环境 ID（不是环境名称），否则会调到别的环境上。

小技巧：报错时页面底部会显示「当前调用：云函数 getVerifyCode @ 环境名」，一眼就能看出运行时实际用的是哪个环境。

3. 不需要配置服务器域名

这是走云开发最大的好处：

• request 合法域名：不用配（小程序不直连站点）
• 域名是否备案：不影响（请求从腾讯的服务器发出，不是从小程序发出）

只有在把 mode 改成 'direct' 时，才需要回公众平台配 request 合法域名。

4. 调试

• project.config.json 里预置了两个编译模式：「模拟扫码进入（scene = u）」和「模拟从文章 12 扫码进入」，直接切换就能模拟扫码。
• 不带任何参数直接打开也能用 —— 进入小程序直接点「获取验证码」就行，不需要文章 ID。验证码本来就是全站通用的。
• 开发者工具里激励视频广告通常拉不到，fallbackOnAdError: true 会在这种情况下直接发码，方便联调。上线前建议改成 false。
• 报错时页面底部会显示「当前调用：云函数 getVerifyCode @ 环境名」，方便确认走的是哪条路、用的是哪个环境。

云端开发步骤

1. 开通

微信开发者工具打开 miniprogram/ → 点顶部工具栏的 「云开发」 → 按提示开通（选按量付费的免费额度即可）。

开通后，资源管理器里 cloudfunctions/ 文件夹右边会显示一行 当前环境: xxx，说明云函数根目录已经挂上了环境。

⚠️ 「环境名称」和「环境 ID」是两个东西

这是最容易搞混的一步：

	长什么样	用在哪
环境名称	短名，比如 prod、test	只是给人看的标签，任何配置里都不要填它
环境 ID	带前缀的一串，比如 cloud1-3gxxxxxxxx	config.js 的 cloudEnv 要填这个

环境 ID 在 云开发控制台首页顶部，或 设置 → 环境设置 里。

config.js 里 cloudEnv 留空 = 用账号的默认环境。只有一个环境时没问题；有多个环境时默认环境不一定是你要的那个，会报「在环境里找不到云函数」。拿不准就把环境 ID 明确填上。

另外，「云函数根目录当前选中的环境」和「小程序运行时 wx.cloud.init 指定的环境」是两件事：前者决定你右键上传时传到哪，后者决定小程序运行时调哪个。两个必须指向同一个环境。

2. 部署云函数

1. 开发者工具左侧文件树里找到 cloudfunctions/getVerifyCode/
2. 右键 → 上传并部署：云端安装依赖
3. 等右下角提示部署成功

目录图标如果是灰色的（不是云朵），说明 project.config.json 里的 cloudfunctionRoot 没生效。检查它是不是 "cloudfunctions/"，然后重启一下开发者工具。

3. 配环境变量

云开发控制台 → 云函数 → getVerifyCode → 配置 → 环境变量，加两条：

变量名	值
WMP_BASE	https://www.iiia.cc/wp-json/wmp/v1
WMP_SECRET	WordPress 后台设置页里那串云函数密钥

改完环境变量需要重新部署一次云函数才生效（或在控制台点「保存并重启」）。

4. 验证云函数

第一步，先 ping 一下 —— 云开发控制台 → 云函数 → getVerifyCode → 测试，传入：

这一步不碰 WordPress，只回答一个问题：函数到底部署成功没有、环境变量读到没有。

正常返回：

wmp_base / wmp_secret 任意一个是「❌ 未配置」，就说明环境变量还没加、或者加完没重新部署。

第二步，再打真实请求 —— 传入：

返回 {"success":true,"data":{"verify_code":"XXXXXX",...}} 就说明整条链路通了。

注意：控制台「测试」时没有真实用户，openid 为空，所以 {"postId":1} 会返回「拿不到用户身份」。要测完整流程请在模拟器里点「获取验证码」。

5. 发布

上传 → 提交审核 → 发布 → 回插件设置把「小程序码版本」改回 正式版 → 重新生成一次小程序码。

排错手册README.md

WordPress 后台 → 设置 → 小程序验证码解锁 → 运行连接自检。它会给出 6 行结果，全绿说明站点侧没问题，问题一定在小程序/云函数侧。

按现象查

现象	大概率原因	怎么修
「云函数 getVerifyCode 还没部署」	没上传 / 传错环境	右键 cloudfunctions/getVerifyCode → 上传并部署；同时确认右键 cloudfunctions 文件夹选的环境 = config.js 里 cloudEnv 那个环境
「云开发环境没对上」	cloudEnv 填错	填的是环境 ID（cloud1-3gxxxxxxxx），不是环境名称（prod）
「云开发还没初始化」	基础库太老 / 代码没执行到	调试基础库调到 ≥ 2.2.3，检查 app.js 的 wx.cloud.init
「签名校验失败」	密钥不一致	后台点「重新生成密钥」后，把新值同步到云函数环境变量并重新部署
「签名已过期」	服务器时间不准	服务器上跑 date 对一下 NTP
「站点返回的不是 JSON」	WMP_BASE 填错 / 固定链接是「朴素」	浏览器直接打开 WMP_BASE/claim，应返回 JSON 报错而不是 HTML
「连接站点失败」	站点公网不可访问 / 证书问题	浏览器打开 https://www.iiia.cc 确认正常
网页前端点解锁报「网络异常」	站点 CDN / 缓存插件拦了 POST	把 /wp-json/* 加进缓存白名单
验证码输对了却说「这篇文章没有可解锁的内容」	文章里没放解锁区块	编辑文章，插入「验证码解锁」区块
解锁后内容只占左边一条、右边空一大片	主题覆盖了容器布局	2.2.0 已修（解锁状态改为块级布局）。若仍存在，清一下页面缓存 / CDN
解锁后一直显示、刷新也还是展开的	浏览器本地存的解锁状态没有过期时间	2.4.0 已修。这不是页面缓存问题 —— 隐藏内容不在页面 HTML 里，缓存插件影响不到它。升级后老记录会被自动清掉
前台样式没生效	页面缓存 / CDN	清缓存

「网络异常」和「HTTP 404」的区别

这两个错误含义完全不同，别混：

现象	含义
网络异常（进 fail 回调）	请求没发出去：域名没加白名单 / 不可达
HTTP 404（进 success 回调）	请求到了，但那个服务器上没有这个接口

走云开发之后，第一种基本不会出现了。

---

七、验证码是怎么防刷的

手段	实现
挡脚本直接刷接口	站点只认带正确 HMAC 签名的请求；签名密钥只存在服务器和云函数环境变量里
openid 不可伪造	由云函数 getWXContext() 在服务端给出，小程序端拿不到也改不了
防重放	签名带 5 分钟时间窗 + 一次性 nonce，同一份签名不能用第二次
防暴力猜码	位数和字符集可配；默认 6 位 31 字符集约 8.9 亿种组合，有效期只有 5 分钟，同时有效的码只有个位数
发码永不失败	code 列没有唯一索引，每次点击直接插一行新记录，不做撞码重试、不做死码回收。随机值和历史记录重复无所谓，短码（4 位纯数字）也不会被发完
到期即报废	校验时直接比对 expires_at，到点立刻失效，不依赖定时任务（定时任务可能延迟）
防接口轰炸（自适应）	/verify 按 IP 限流，且按组合数反推：组合数越少限流越紧（4 位纯数字 → 3 次/分钟），把「有效期内猜中」的概率压在 1% 以内；/claim 按 openid 限流每分钟 10 次
防并发重复使用	用带 status='unused' 条件的原子 UPDATE 抢占，同一枚码并发提交只有一个能成功
防源码泄露	隐藏内容只存在数据库，前台 HTML 里根本没有；render_callback 明确忽略 InnerBlocks 的渲染结果

再加一层的话，可以在广告位后台开启「激励视频广告服务端验证」，把 transId 一起传给云函数做二次校验。具体接口以微信流量主官方文档为准，cloudfunctions/getVerifyCode/index.js 里预留了 event 传参位置。

---

八、开通激励视频广告的前置条件

条件	说明
小程序已发布	需先上线
累计独立访客 UV ≥ 1000	流量主开通门槛，个人主体也能申请
已开通流量主	公众平台 → 流量主 → 开通，再建「激励式视频广告」广告位

UV 不够之前，用 fallbackOnAdError: true 先上线跑量，等流量主开通后再切回来。

---

九、几个必须知道的坑

云函数目录没有云朵图标 → project.config.json 的 cloudfunctionRoot 必须是 "cloudfunctions/"，改完重启开发者工具。

改了环境变量但没生效 → 云函数的环境变量改动需要重新部署或重启才生效。

重新生成密钥后小程序立刻全挂 → 这是预期行为。新密钥必须同步到云函数环境变量，两边的密钥必须完全一致。

小程序码扫不开 → 小程序没发布时，设置里的「小程序码版本」必须是「体验版」，而且扫码人得在体验成员名单里，然后重新生成一次码。

隐藏内容会不会被搜索引擎抓到 → 正常情况下不会，前台 HTML 里根本没有这段内容。但有一个例外：如果你的主题或 SEO 插件是用「原始正文」去生成 meta description（wp_strip_all_tags($post->post_content) 这种做法），那它会把区块内部的文字也带进描述里。建议在 SEO 设置里手写一段描述，或者确认主题用的是标准摘要逻辑。

改主题后区块跑到了「未分类」 → 设置页里的「区块分类」默认是 zibll。插件会自动跟随主题里已有的 Zibll 区块分类；主题不是 Zibll 就改成 widgets。

验证码数据想清掉 → 后台停用再启用插件不会删数据。要彻底清干净，执行：

（把 wp_ 换成你自己的表前缀；小程序码图片在媒体库里，自己删。）