生产环境敏感错误堆栈过滤核心是“不传、不记、不显”:上报前用sanitizeStack清洗err.stack中的token、身份证等字段;限制contextData采集范围,脱敏路由参数与用户信息;屏蔽console.error等开发行为;构建时禁用sourcemap并配置Nginx禁止访问.map文件。

生产环境过滤敏感错误堆栈,核心是“不传、不记、不显”——在错误上报前做清洗,而不是依赖后端或监控平台兜底。
剥离堆栈中的敏感字段
错误堆栈(err.stack)常含用户输入、token、手机号、身份证号等原始值。需在上报前正则匹配并替换:
- 用 replace() 清洗常见模式:如
/token=([^&\s]+)/gi→"token=[REDACTED]",/idCard=([^&\s]+)/gi→"idCard=[REDACTED]" - 避免全局替换导致误伤,建议只处理 stack 字符串中 URL 参数、对象字面量字符串片段(如
{"token":"abc"}),不碰行号、文件名等定位信息 - 可封装为通用函数:
sanitizeStack(stack),在app.config.errorHandler和unhandledrejection回调中统一调用
限制上下文数据的采集范围
contextData(如当前路由、用户ID、请求参数)是高危泄露点,必须按需脱敏:
- 路由参数中只保留必要字段,如
router.currentRoute.value.params.id可留,但.query.token必须过滤 - 用户信息不传完整对象,仅上报脱敏后的标识:如
userId: "u_8a2f"(哈希后截取),而非{ id: 123, name: "张三", phone: "138****1234" } - 禁止将
req.body或form data原样塞入日志;若需调试,只记录字段名和类型(如"password": "[string, masked]")
禁用开发期暴露行为
很多敏感泄露其实来自开发习惯延续到生产环境:
立即学习“前端免费学习笔记(深入)”;
- 确保
console.error在生产环境被完全屏蔽(可通过 Webpack DefinePlugin 或 Vite define 配置process.env.NODE_ENV === 'production'判断) - 禁用
JSON.stringify直接序列化响应式对象用于日志;改用toRaw()+ 显式白名单字段提取 - 移除所有
debugger、console.table、console.dir等调试语句;CI 构建阶段可用 ESLint 规则no-console+ 自定义正则拦截
构建时与运行时双重防护
光靠 JS 运行时过滤不够,要结合构建环节加固:
- Vite 中设置
build.sourcemap = false或仅生成hidden模式,防止 .map 文件泄露源码结构 - Webpack 中关闭
devtool: 'source-map',改用'hidden-source-map'并将 map 文件单独上传至 Sentry/Bugsnag,不随静态资源发布 - 服务端 Nginx/Apache 配置禁止访问
*.map和*/src/*路径,从网络层堵死源码获取可能


















