ARTICLE DETAIL

资讯详情

深耕网站建设、视觉设计与SEO优化的一线实战洞察。

全栈项目实战手记|艺培场馆课时预约小程序底层安全、交互、分包全量迭代复盘

全栈项目实战手记|艺培场馆课时预约小程序底层安全、交互、分包全量迭代复盘 承接第四、五、六篇业务层面 Bug 复盘前面几篇已经完成后台业务 Bug、学员‑教师‑后台三端联动、定时任务、弱网并发、页面交互类问题复盘。本篇专门处理 迭代新增的底层安全、会话鉴权、密码兼容、数据脱敏、接口限流、小程序分包、PC 管理端 Demo 相关问题业务层逻辑 Bug 不再重复赘述。 统一采用现象 → 根因分析 → 修复方案 → 开发启示结构。一、Token 与会话生命周期相关踩坑坑 1Token 过期之后页面依旧保留本地登录态不会自动跳转登录页现象管理员 / 子账号登录后台Token 到达有效期用户不主动退出继续操作后台页面本地依旧保存旧 Token页面不会自动跳转到登录页发起接口才返回鉴权失败用户体验差。根因前端没有对接口返回的 401 未授权状态做统一拦截处理没有做本地 Token 有效期校验仅依靠后端接口返回错误之后才感知会话失效。修复方案请求拦截器统一捕获 401 返回码清除本地全部登录凭证直接跳转登录页面并给出提示前端本地解析 Token 内的过期时间页面 onShow 做预校验提前感知会话过期后端维护 Token 黑名单过期、登出后的 Token 加入黑名单即使伪造携带也直接拦截。开发启示会话失效不能只靠后端接口返回前端全局拦截器要统一处理鉴权失败黑名单机制防止旧凭证被重复使用。坑 2用户执行登出操作旧 Token 依旧可以调用后台接口现象账号正常点击退出登录前端清除本地 token但是把登出前的 Token 复制出来依旧可以调用后台业务接口执行操作。根因登出动作仅仅清除前端存储后端没有将该 Token 加入黑名单接口鉴权仍然认为该 Token 有效。修复方案用户登出时后端把当前 Token 写入黑名单集合所有后台接口鉴权阶段校验黑名单黑名单内的 Token 直接返回 401 拒绝访问。设置黑名单过期时间与 Token 生命周期对齐。开发启示服务端会话管控不能完全依赖前端清除凭证后端黑名单是强制兜底。坑 3V1.0 旧版本 MD5 密码账号无法兼容 V2.0 加盐密码体系现象升级 V2.0 加盐加密之后V1.0 遗留纯 MD5 加密的老账号登录失败无法正常登录后台。根因V2.0 全部使用 salt 加盐哈希校验逻辑没有做旧密码的兼容适配逻辑。修复方案登录校验阶段如果是旧 MD5 格式账号先用旧算法校验密码密码校验通过之后自动生成随机盐把密码升级为加盐加密格式更新入库数据库增加字段标记账号密码加密版本。开发启示系统加密算法迭代必须做好旧数据兼容迁移避免存量用户无法登录。二、细粒度权限与敏感数据脱敏踩坑坑 4低权限子账号学员手机号、姓名明文直接返回无脱敏处理现象配置无隐私权限的子管理员账号进入学员列表页面可以直接看到学员完整手机号、明文姓名存在用户隐私泄露风险。根因接口没有根据账号权限码做脱敏分支无论账号拥有何种权限全部返回完整学员敏感字段。修复方案定义权限码student:privacy查看学员完整隐私、booking:proxy拥有代预约权限接口返回学员数据时判断当前登录账号权限无隐私权限则对手机号、姓名做掩码脱敏PC 管理端、小程序后台两套接口复用同一套脱敏逻辑。开发启示敏感数据脱敏逻辑放在接口层不要只在前端做掩码防止抓包拿到明文数据。坑 5子账号缺少权限码校验越权执行代预约操作现象未分配booking:proxy代预约权限的子账号依旧可以调用代预约接口给学员创建预约记录。根因页面隐藏代预约按钮但是后端接口没有校验该权限码仅做前端按钮隐藏接口没有鉴权拦截。修复方案所有受权限码控制的接口后端鉴权中间件校验对应权限标识无权限直接返回 403 禁止访问前端仅做 UI 层面控制。开发启示细粒度权限前端只做界面隐藏权限校验必须放在后端接口中间件。三、接口限流与防护踩坑坑 6后台业务接口没有限流短时间高频请求容易压垮云开发环境现象恶意或者异常客户端短时间大量循环调用后台接口数据库查询暴涨云函数被大量消耗出现整体响应变慢。根因V1.0 版本没有接口限流逻辑不对单账号请求频率做限制。修复方案增加接口限流中间件单账号一分钟最大请求阈值超过阈值返回 429 请求过于频繁拒绝多余请求。针对高危写接口进一步收紧频率。开发启示云开发环境资源有限管理后台写接口一定要增加限流防护避免资源被恶意消耗。四、小程序分包工程化踩坑坑 7小程序主包体积超限无法上传发布现象所有后台、学员、教师页面全部放在主包代码包体积超出微信小程序 2MB 限制上传代码包时报错。根因V1.0 没有做分包拆分全部业务页面、组件全部打包进主包。修复方案进行小程序分包改造学员端业务、管理员后台业务拆分为独立 subPackages 分包主包只保留首页、登录、公共基础组件每个分包打包体积控制在 2MB 以内满足微信上传限制。开发启示业务页面多的小程序早期就要规划分包避免后期迭代包体积超限。坑 8跨分包页面跳转出现资源缺失、页面空白样式错乱现象从学员端分包页面跳转管理员后台分包页面偶发页面空白、组件样式丢失、资源加载失败。根因分包组件引用路径错误部分公共组件只放在某个分包没有放到主包公共目录跨分包跳转资源未正常加载。修复方案公共组件、公共样式统一放置主包校验分包页面路由配置修正页面路径测试覆盖全部跨分包跳转场景。开发启示分包模式下公共资源路径很容易出错所有跨分包访问的组件、样式统一放在主包。坑 9分包没有按需懒加载小程序启动加载全部分包资源首屏加载缓慢现象小程序打开首页就加载全部分包资源首页打开速度慢。根因错误配置分包把分包页面配置进主包或者配置预加载策略不合理。修复方案保证 subPackages 分包为按需加载仅进入分包页面的时候才加载分包资源合理配置 preloadRule 预加载规则。开发启示分包的核心收益就是按需加载错误配置会完全失去分包优化效果。五、PC 管理端 Demo 专项踩坑坑 10PC 端 Mock 离线模式部分字段和线上云函数返回数据不一致现象PC 管理端开启 Mock 离线演示模式部分业务字段、计算结果和真实云开发环境返回结果存在细微差异用于演示容易产生误解。根因Mock 模拟数据硬编码写死没有复用业务计算逻辑Mock 与真实业务逻辑两套实现。修复方案Mock 模式尽量复用同样的业务计算函数仅替换数据源关键业务输出保证 Mock 与线上逻辑完全对齐。开发启示Mock 演示模式不要复制一份业务逻辑尽量复用公共业务函数避免模拟数据和真实业务结果脱节。坑 11PC 端与小程序后台相同业务课时计算逻辑不一致现象PC 管理端执行手动核销学员课时扣减数值和小程序管理员后台执行相同操作结果不一致。根因PC 端 Demo 独立实现一套课时计算扣减逻辑没有复用云函数公共业务逻辑。修复方案PC 端所有写操作全部调用云端云函数由云函数统一执行业务计算Mock 模式复用同一套计算工具函数保证两端结果完全一致。开发启示多端管理端小程序后台 PC 后台业务计算全部收敛到后端云函数客户端只做展示不在客户端执行业务计算。坑 12PC 端操作业务审计操作日志没有正常写入现象在 PC 管理端执行代预约、修改排班、撤销核销等操作后台审计日志表没有生成对应操作记录。根因PC 端业务分支调用云函数时没有带入操作者身份信息没有触发统一日志写入工具。修复方案PC 端所有业务请求携带操作者身份标识云函数层统一处理操作日志写入不区分请求来源是小程序还是 PC 端。开发启示多客户端接入同一套后端日志、鉴权逻辑在云函数层统一处理不要区分客户端来源。六、迭代复盘总结启示安全鉴权不能只依赖前端Token 会话、黑名单、权限码校验、数据脱敏全部在后端接口层实现前端仅做交互控制。加密算法升级一定要做好存量兼容避免老账号无法登录使用系统。小程序分包改造重点关注包体积、跨分包资源引用、按需懒加载三个点防止分包改造引入新问题。PC 管理 Demo 属于多客户端接入业务计算、日志、鉴权全部收敛在后端不要在客户端重复实现业务逻辑避免逻辑分裂。云开发环境资源有限接口限流、黑名单、会话管控是保障系统稳定运行的底层手段。至此全项目所有 Bug、缺陷、风险点全部复盘完毕 第四篇纯后台业务 Bug第五、六篇三端联动、核销预约、定时任务、弱网并发交互 Bug第七篇V2.0 底层安全、分包、PC Demo 迭代问题。 第八篇将为 PC 管理端 Demo 完整成果展示第九篇为项目整体全流程总结复盘。本文属于《全栈项目实战手记艺培场馆课时预约小程序》专栏系列持续更新可订阅专栏阅读完整连载。连载目录回顾第一篇艺培场馆课时预约小程序 B 端管理后台完整产品设计思路第二篇艺培场馆课时预约小程序 C 端学员端完整产品设计思路第三篇艺培场馆课时预约小程序后台、教师端、学员端实拍与业务流程图汇总第四篇艺培场馆课时预约小程序后台开发踩坑复盘课程、学员、权限配置类 Bug第五篇艺培场馆课时预约小程序用户端 后台联动踩坑上篇预约、课时、同步问题第六篇艺培场馆课时预约小程序用户端 后台联动踩坑下篇排课核销、定时任务、页面交互异常第七篇艺培场馆课时预约小程序 V2.0 底层安全、交互、分包全量迭代复盘第八篇艺培场馆课时预约小程序 PC 管理端 Demo 完整开发成果展示第九篇艺培场馆课时预约小程序全项目开发历程完整复盘总结
返回列表