在前端CI/CD中加入本地存储合规检测脚本，旨在自动拦截localStorage、sessionStorage、IndexedDB对敏感字段的明文持久化；通过正则扫描JS/TS文件中的setItem调用、敏感键名匹配及JSON.stringify参数推断实现风险识别，并集成至GitHub Actions等流水线，在构建前卡点阻断违规写入。
在前端 CI/CD 流程中加入本地存储合规检测脚本，核心目标是拦截代码中对 localStorage、sessionStorage 或 IndexedDB 的不安全写入行为，防止用户凭证、身份证号、手机号等敏感字段被明文持久化到浏览器端。这不是靠人工审查能兜住的环节，必须自动化卡点。
识别哪些操作属于高危写入
检测脚本需聚焦三类典型风险模式：
- 直接赋值含敏感关键词的键名：如
localStorage.setItem("token", ...)、localStorage.setItem("idCard", ...) - 未脱敏就存入用户输入：如
localStorage.setItem("userInfo", JSON.stringify(formValue))，而formValue包含手机号或邮箱 - 使用弱封装函数且未声明白名单：如自定义
safeStore.set(key, value)，但内部未校验key是否在允许列表内
编写轻量级扫描脚本（Node.js）
无需引入重型 AST 工具，用正则+简单语法树即可覆盖 90% 场景。示例脚本逻辑如下：
- 遍历所有
.ts和.js文件，提取所有localStorage.和sessionStorage.调用语句 - 匹配
setItem第一个参数是否为字符串字面量，并检查是否命中预设敏感词表（token、auth、password、idcard、phone等） - 对
JSON.stringify()的入参做基础字段推断：若变量名含user、profile、form等，且调用位置在setItem内，标记为“需人工复核” - 发现违规立即退出并打印文件路径与行号，CI 流程中断
集成进 GitHub Actions 或 GitLab CI
在现有流水线测试阶段后、构建前插入该检查。以 GitHub Actions 为例，在 .github/workflows/ci.yml 中添加：
PigX UI 前端开发
下载
PigX UI Pro 前端开发指南 - Vue 3 + TypeScript + Element Plus。当用户提到 PigX UI、PigX 前端、lgb-mgui 项目、Vue 3 企业级后台开发、Element Plus 后台开发时使用此技能。
立即学习“前端免费学习笔记（深入）”；
- name: Check local storage compliance run: node scripts/check-local-storage.js working-directory: ./src
脚本路径按项目结构调整；建议将敏感词表抽离为独立 JSON 文件，便于安全团队统一维护和审计。
配套工程约束机制
单靠检测不够，要配合防御性设计：
- 在项目中提供
@utils/storage封装模块，强制所有写入必须走该接口，内部自动过滤敏感 key 并记录审计日志 - 在 ESLint 配置中增加自定义规则，禁止直接调用
localStorage.setItem，报错提示改用封装层 - CI 报告中单独输出“本地存储写入统计”，包括总调用次数、敏感 key 出现场景、封装层使用率，供质量回溯
