创业前端架构：合规·可信·防护三位一体

　　掘金上刷到“创业前端架构：合规·可信·防护三位一体”那篇热帖，我盯着标题看了十八秒，没点开——不是懒得看，是第三杯咖啡刚凉透，手还停在触控板上，群里弹出一条：“@你 你昨晚改的 src/utils/auth.ts 那个 useTokenRefresh hook，跟风控 SDK 初始化顺序撞了，mock 环境过不去。”

　　我原以为只是 webpack alias 冲突，结果翻 commit 记录发现，是前天凌晨两点发的 hotfix，commit msg 写着“修复 token 过期兜底逻辑（临时）”，后缀还带了个 ???? 表情。笑得出来？我切回终端敲了三遍 `yarn build --mode=prod --report`，第三次才想起这个项目压根没配 bundle analyzer 插件，报表目录根本不存在。

　　去年十月，某库某表上线灰度的那天下午三点十七分，监控大屏突然全绿——不是报警绿，是那种毫无波动、连 CPU 都贴着 3.2% 不动的绿。运维老张端着保温杯凑过来，说：“绿得瘆人。” 我当时在调试一个跨域 Cookie 的 SameSite 属性 fallback 路径，手抖把 `Lax` 改成了 `lax`，本地跑通了，但 Safari 14 下直接不发凭证。这事我没提，因为五分钟后，法务部同事推门进来问：“你们前端打点里有个字段叫 ‘user_behavior_intent’，这词儿能不能换个说法？‘intent’ 在 GDPR 附件四里被标红三次。”

　　我点头说行，转身就删了那个字段，改叫 ‘user_action_stage’。但你知道最离谱的是啥？删完不到一小时，测试提了工单：「首页 banner 点击埋点丢失，前端日志无上报，network 面板显示 400」。查了半天，发现是 axios 拦截器里对字段名做了强校验，白名单里漏掉了新名字——而那个白名单配置，藏在 src/config/api.ts 里，和所有 env 配置硬编码绑在一起，deploy 时靠 CI 脚本 sed 替换。没人碰过它。没人敢碰。

　　所以现在回头看，“合规·可信·防护三位一体”——听着像架构峰会 keynote 结尾那张 PPT，光洁、对称、有阴影渐变。但它站得住的地方，真就只有“优胜劣汰”四个字。不是设计出来的，是熬出来的。是开发凌晨一点说“这个拦截器先 bypass 吧，联调等不及了”，你反手就把 `if (process.env.NODE_ENV === 'production')` 删了；是测试提了第十七次 “HTTPS 证书链缺失警告”，你最后发现是 nginx 配了 fullchain.pem 却没 reload；是某次恢复演练，从数据库 dump 恢复到服务可读写花了三百七十二秒——其中两百一十四秒卡在前端静态资源加载失败，因为 index.html 里写的 script src 是 http://cdn.xxx.com/v1.2.3/，而 CDN 的 HTTP 回源规则早半年就下线了。

　　跟前端负责人吵过一次。他说：“安全是兜底，不是前置。” 我说：“你上次说兜底，是在埋点里传明文手机号的那次。” 他顿了三秒，说：“那个是业务方强塞的。” 我说：“好，那你告诉我，为什么 ‘强塞’ 的接口签名算法，用的是 base64(md5(时间戳+key))，密钥写死在 config.js 里？” 他没接。我后来查了 Git blame，是前年八月，另一个已离职同学提的 PR，title 叫《优化首次加载体验》，desc 写着“减少签名耗时”。这个我敢打包票——那个 commit 的 author email 域名后缀，现在还在公司邮箱白名单里挂着，但人已经去新加坡了，微信头像换成了潜水照。

　　说到潜水……我上周去趟三亚，手机没信号那三天，居然梦到 webpack 打包成功提示音。醒来发现是空调外机在响。真的。声音一模一样。

　　所以别跟我聊什么“三位一体”的抽象模型。我只信一件事：当法务要加个 consent 弹窗、安全部要加 CSP、老板说“用户不能感知任何延迟”这三件事在同一个迭代周期内压下来时，最先掉链子的，永远是那层所谓“统一网关代理”的 mock 层——因为它既不真 proxy，也不真 mock，只是用 vite 插件在 devServer 上伪造响应头。而线上？线上早就绕过它直连 BFF 了。没人记得关开关。开关在 vite.config.ts 里，注释写着 // TODO: remove before prod deploy ——这行注释，是去年五月我加的，至今未动。

文章配图，仅供参考

　　我现在每天早上进公司第一件事，是打开 Chrome DevTools 的 Application → Clear storage，手动删掉所有的 service worker、cache、cookies、indexedDB。因为上个月有次缓存污染，导致某个降级路由一直 fallback 到 mock 数据页，整整三天没被发现。不是监控没报，是监控只报 error boundary，不报“本该跳转却停留主页”这种事。这种事没法报——它没抛错，只是静默错了。

　　所以接下来我打算干件小事：下周起，每条 PR 都强制要求截图展示本地 dev server 控制台最后一行输出——必须带时间戳。不是为了看日志，是看那个 webpack watch 的编译完成提示符有没有抖动。如果有，说明 HMR 没生效，可能某些模块的依赖链崩了。这事我不指望自动化，我就想看看谁还在用 eval-source-map。我知道有人用，因为上周五我见过他终端窗口右下角一闪而过的红色 warning：[eval-source-map] is not suitable for production ——但他点了右上角叉，关了整个 terminal。

（编辑：站长网）

【声明】本站内容均来自网络，其相关言论仅代表作者个人观点，不代表本站立场。若无意侵犯到您的权利，请及时与联系站长删除相关内容!