如何利用 Proxy 劫持异步 API 返回值实现具备“自动数据脱敏”功能的拦截器层-js教程-PHP中文网

必须在异步api调用入口劫持而非代理promise返回值：重写fetch和patch xmlhttprequest.send，在响应解析后结构化脱敏，保持promise链与类型契约，按字段路径白名单精准掩码，仅对敏感环境启用。

如何利用 proxy 劫持异步 api 返回值实现具备“自动数据脱敏”功能的拦截器层

不能直接用 Proxy 劫持异步 API（如 fetch、XMLHttpRequest）的返回值本身，因为 Promise 实例不可代理，且其 resolve/reject 值是运行时动态产生的。真正可行的方式是：在调用入口处拦截，对原始响应做结构化解析与脱敏处理，并确保脱敏逻辑不破坏原有 Promise 链与类型契约。

聚焦入口劫持，而非代理返回值

异步 API 的“返回值”本质是 Promise，而 Promise.prototype 是不可写、不可配置的；Proxy 只能代理对象，无法拦截 Promise 状态变更或 .then() 内部值。因此必须前移到发起阶段：

重写 window.fetch：保存原函数，用新函数包裹，在 response.clone().json() 或 .text() 后对解析出的 JS 对象/字符串执行脱敏
打补丁 XMLHttpRequest.prototype.send：监听 onload 事件，在 this.response 可读后，根据 responseType 判断是否需 JSON 解析再脱敏
不劫持 Promise.then 或全局微任务队列——易引发递归、污染第三方库、破坏错误堆栈

结构化脱敏：按字段路径匹配 + 白名单驱动

自动脱敏不是简单替换字符串，而是基于响应数据结构进行精准字段识别与掩码。例如：

FastAPI Flask Proxy

FastAPI + Flask 混合部署最佳实践，解决路由定义、API 代理等常见问题，适用于同时运行 FastAPI API 与 Flask 前端的场景。

下载

定义脱敏规则：["user.phone", "data.token", "profile.idCard"] 或正则 /.*password.*/i
对 JSON 响应递归遍历，若当前路径匹配规则，则将值替换为 "***" 或哈希前缀（如 "tok_abc123..."）
保留原始数据类型（string → string，number → number），避免因脱敏导致前端解析失败
跳过非对象/数组响应（如纯文本、二进制 blob），只处理可结构化解析的内容类型（application/json、text/plain 含 JSON 片段）

保持 Promise 行为契约，不破坏链路

脱敏操作必须同步完成，且不能改变原始 Promise 的 resolve 值类型或抛出未捕获异常：

脱敏后构造新 Response 实例：new Response(JSON.stringify(sanitized), { status: res.status, headers: res.headers })
若原请求使用 responseType = "blob"，则先转为 text/json 再脱敏，最后转回 blob（注意 Blob 构造开销）
所有异常需 try/catch 并 console.warn 记录，但最终仍 resolve 原始响应——避免因脱敏失败导致业务请求中断
不额外发请求（如上报脱敏日志走另一个 fetch），防止竞态或循环采集