值在传给支付库之前已经坏了,修复入口在自己的结账代码,不在第三方。
调试与质量 · 定位工具
调用栈Stack Trace
调用栈从抛错点往下列出函数路径;跳过框架帧后,第一个业务帧才是该改的入口。
先看见结账崩溃,再从调用栈往下找业务帧
左边是炸掉的支付页,右边是这次 TypeError 的 Call Stack。打开后会标出 submitOrder;点到 vendor 会变成无法定位。
第 0 步 · 打开工具先打开开发者工具 → Console,点开红色 TypeError,或到 Sources 看 Call Stack
夏季衬衫 × 1¥ 269
!
支付崩溃 · TypeErrorchargeCard 读到 undefined,支付按钮停住
Call Stack
等待打开这次崩溃还没有帧打开这次崩溃后,栈会从炸点往下列出。
这一帧的值打开崩溃后才会出现
调用栈记录错误发生时的函数路径。局部变量长在选中帧上;卡在 vendor 的原因是压缩帧无法定位,下一步跳回业务帧恢复。
知识点:栈顶是炸点,业务帧才是入口
上面的工作台已经演示了核心关系,这里只给可复用的命名。
- 栈顶告诉你在哪抛错,不一定是你该改的地方。
- 往下跳过框架和压缩帧,第一个业务文件才是入口。
- 选中帧后读局部变量:值在哪一帧变坏,就从哪一帧修。
什么时候用、怎么用
红字 TypeError、白屏或支付中断时,先读调用栈,而不是只复制最后一行报错。
- 入口:打开开发者工具的 Console,点开红色错误,或到 Sources 看 Call Stack。
- 最短路径:打开这次崩溃 → 跳过 vendor → 选首个业务帧 → 读该帧变量。
- 不要在 vendor.min.js 里改代码;行号对不上,也无法验证。
正反例:同一支付崩溃,只改你点开哪一帧
目标都是找到 order 变成 undefined 的地方。差别只在有没有停在业务帧。
压缩帧无法定位,只会在第三方里空转;栈顶 chargeCard 只是最后读到空值的地方。
快速自测
支付页报 TypeError,栈顶在第三方 chargeCard。你该先看哪一帧?
继续查证
术语的技术定义和行为以这些一手或权威资料为准。
下一步学
和本知识点经常一起出现的概念。