讲师中心 微信公众号
AI工具推荐 视频效率加速

如何规避JSON深拷贝在面对循环引用对象时抛出类型错误的致命漏洞

胖浩大大_5776

胖浩大大_5776

发布时间:2026-06-23 11:42:19

|

254人浏览过

|

来源于php中文网

原创

直接用 JSON.parse(JSON.stringify(obj)) 处理含循环引用的对象会抛出 TypeError,因 JSON 标准不支持循环结构;应改用 structuredClone()、手写 WeakMap 递归克隆或 Lodash 的 _.cloneDeep()。

如何规避json深拷贝在面对循环引用对象时抛出类型错误的致命漏洞

直接用 JSON.parse(JSON.stringify(obj)) 处理含循环引用的对象,会立刻抛出 TypeError: Converting circular structure to JSON ——这不是程序 bug,而是 JSON 标准本身不允许循环结构。规避的关键不是“绕过报错”,而是换掉不支持该场景的工具。

用 structuredClone() 替代 JSON 方法

现代环境(Chrome 98+、Firefox 94+、Node.js 17.0+)已原生支持 structuredClone(),它专为解决这类问题设计:

  • 自动识别并正确重建循环引用,克隆后 clone.self === clone 依然成立
  • 保留 Date、RegExp、Map、Set、BigInt 等类型,不转成空对象或字符串
  • 一行代码搞定:const copy = structuredClone(original);
  • 注意:不复制函数体(只保留引用)、不支持 DOM 节点和某些特殊内置对象

手写递归 + WeakMap 记录已拷贝对象

当需要兼容旧环境,或必须保留函数、undefined、Symbol 等 JSON 无法处理的类型时,手动实现更可控:

Feishu calendar sync, local ics to json data for AI agent
Feishu calendar sync, local ics to json data for AI agent

将ICS日历文件转为JSON格式,用于飞书日历导入导出及数据集成。

下载
  • 用 WeakMap 缓存原始对象 → 克隆对象的映射,遇到重复引用直接返回已有副本
  • 对 Array、Date、RegExp、Set、Map 等类型做单独构造,避免调用默认 {}
  • 函数类型可选择原样赋值(typeof obj === 'function' ? obj : ...),不触发递归
  • 示例核心逻辑:if (seen.has(obj)) return seen.get(obj); seen.set(obj, clone);

引入成熟第三方库(如 Lodash)

项目已依赖 Lodash 或追求开箱即用的稳定性,_.cloneDeep() 是经过长期验证的选择:

  • 内部已内置循环引用检测与跳过机制,不会栈溢出
  • 支持大部分 JS 内置类型,包括稀疏数组、类数组对象等边界情况
  • 若需保留函数,可配合 customizer 参数定制行为:_.cloneDeep(obj, (val) => typeof val === 'function' ? val : undefined)
  • 代价是增加约 20–30KB 的包体积,纯前端小项目需权衡

不推荐的“修复”思路

试图给 JSON.stringify 加包装器来“捕获错误再重试”,本质无效:

  • JSON 格式规范无循环引用语法,强行序列化必然失败,没有中间态可挽救
  • 第三方库如 flatted 或 circular-json 本质是改写序列化格式(加入 $ref),结果不再是标准 JSON,前后端互操作风险高
  • 降级到 try/catch 后再切 deepCopy 逻辑,只是避免崩溃,不能补回丢失的数据

热门AI工具

更多
墨刀AI
墨刀AI Hot

一款AI图像与设计工具,主要用于产品经理的专属智能体,适合需要提升相关任务效率的用户。

PixTV
PixTV Hot

PixTV是一款面向AIGC内容创作的AI视频生成工具。

Laper
Laper Hot

Laper是专为编剧、导演和制片人推出的 AI 原生剧本创作工具。

WorkBuddy

一款AI办公效率工具,主要用于腾讯云推出的AI原生桌面智能体工作台,适合需要提升相关任务效率的用户。

DeepSeek

DeepSeek是一款面向对话、写作、编程和推理场景的AI大模型工具。

VibeKnow
VibeKnow Hot

一款AI视频创作工具,主要用于全球首个AI知识视频创作平台,文档、文章、网页,一键生成视频,适合需要提升相关任务效率的用户。

豆包大模型

豆包大模型是一款由字节跳动推出的企业级大语言模型服务平台。

UP简历
UP简历 Hot

一款AI办公效率工具,主要用于基于AI技术的免费在线简历制作工具,适合需要提升相关任务效率的用户。

讯飞绘文

讯飞绘文是一款由科大讯飞推出的一站式 AIGC 内容运营平台。

相关专题

更多
json数据格式
json数据格式

JSON是一种轻量级的数据交换格式。本专题为大家带来json数据格式相关文章,帮助大家解决问题。

2035

2023.08.07

json是什么
json是什么

JSON是一种轻量级的数据交换格式,具有简洁、易读、跨平台和语言的特点,JSON数据是通过键值对的方式进行组织,其中键是字符串,值可以是字符串、数值、布尔值、数组、对象或者null,在Web开发、数据交换和配置文件等方面得到广泛应用。本专题为大家提供json相关的文章、下载、课程内容,供大家免费下载体验。

2962

2023.08.23

jquery怎么操作json
jquery怎么操作json

操作的方法有:1、“$.parseJSON(jsonString)”2、“$.getJSON(url, data, success)”;3、“$.each(obj, callback)”;4、“$.ajax()”。更多jquery怎么操作json的详细内容,可以访问本专题下面的文章。

1016

2023.10.13

go语言处理json数据方法
go语言处理json数据方法

本专题整合了go语言中处理json数据方法,阅读专题下面的文章了解更多详细内容。

3359

2025.09.10

ajax教程
ajax教程

php中文网为大家带来ajax教程合集,Ajax是一种用于创建快速动态网页的技术。通过在后台与服务器进行少量数据交换,Ajax可以使网页实现异步更新。这意味着可以在不重新加载整个网页的情况下,对网页的某部分进行更新。php中文网还为大家带来ajax的相关下载资源、相关课程以及相关文章等内容,供大家免费下载使用。

2620

2023.06.14

ajax中文乱码解决方法
ajax中文乱码解决方法

ajax中文乱码解决方法有设置请求头部的字符编码、在服务器端设置响应头部的字符编码和使用encodeURIComponent对中文进行编码。本专题为大家提供ajax中文乱码相关的文章、下载、课程内容,供大家免费下载体验。

340

2023.08.31

ajax传递中文乱码怎么办
ajax传递中文乱码怎么办

ajax传递中文乱码的解决办法:1、设置统一的编码方式;2、服务器端编码;3、客户端解码;4、设置HTTP响应头;5、使用JSON格式。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

2433

2023.11.15

ajax网站有哪些
ajax网站有哪些

使用ajax的网站有谷歌、维基百科、脸书、纽约时报、亚马逊、stackoverflow、twitter、hacker news、shopify和basecamp等。本专题为大家提供相关的文章、下载、课程内容,供大家免费下载体验。

1141

2024.09.24

LLVM自定义Pass怎么写
LLVM自定义Pass怎么写

本专题聚焦LLVM自定义Pass开发,整理Pass类结构、run()方法、PreservedAnalyses、CMake构建、插件注册、-load-pass-plugin加载和测试用例编写流程。

100

2026.09.30

热门下载

更多
网站特效
/
网站源码
/
网站素材
/
前端模板

精品课程

更多
相关推荐
/
热门推荐
/
最新课程
关于我们 免责申明 举报中心 意见反馈 讲师合作 广告合作 最新更新
php中文网:公益在线php培训,帮助PHP学习者快速成长!
关注服务号
PHP中文网订阅号
每天精选资源文章推送

Copyright 2014-2026 https://www.php.cn/ All Rights Reserved | php.cn