Web 检查器参考URL 断点
URL 断点在调试由 JavaScript API(例如 XMLHttpRequest
或 fetch
)发起的网络请求时非常有用。
通过单击
所有URL 断点在 Web 检查器会话之间都会被保留。
URL 断点有两种不同类型:包含和匹配。
包含
启用后,包含类型的URL 断点会在 JavaScript API 发送任何 URL 包含给定文本的网络请求之前暂停 JavaScript 执行。
匹配
启用后,匹配类型的URL 断点会在 JavaScript API 发送任何 URL 匹配给定正则表达式的网络请求之前暂停 JavaScript 执行。
特殊断点
除了包含和匹配类型的URL 断点之外,还有一个特殊的URL 断点:所有请求。
启用后,所有请求URL 断点无论请求的 URL 是什么,只要 JavaScript API 发送任何网络请求,都会暂停 JavaScript 执行。
通过单击
配置
URL 断点有几种不同的配置选项,通过右键单击并在上下文菜单中选择编辑断点…即可访问。
条件输入允许您仅在给定 JavaScript 评估为真值时才限制URL 断点暂停 JavaScript 执行。这对于您只想在满足特定条件(例如变量具有特定值)时才暂停 JavaScript 执行的情况非常有用。请记住,当URL 断点被命中时,包含的 JavaScript 会被评估,并且根据您作为条件运行的代码,可能会导致额外的副作用。
然而,除了执行任意代码,您可能只是想忽略URL 断点前几次被命中的情况。如果是这种情况,将忽略输入设置为任何正整数将阻止URL 断点暂停执行,直到它被命中那么多次数。
现在您可能想知道什么是“操作”。共有四种不同类型
-
记录消息
这基本上是使用
console.log
记录值的“快捷方式”。您提供的字符串行为类似于模板字面量,这意味着只要它在${…}
内部,您就可以评估任意 JavaScript。 -
评估 JavaScript
可以说是最强大的URL 断点操作,它允许您在URL 断点被命中时评估任何任意 JavaScript。给定的 JavaScript 会在代码行之前执行,这意味着它将可以访问相关行之前在该作用域中可用的所有变量。
-
播放声音
添加其中之一将使 Web 检查器在URL 断点被命中时播放系统蜂鸣声。
-
探测表达式
探测表达式可以被认为是迷你“控制台”。每当相关的URL 断点被命中时,探测表达式都会被评估,结果会保存在详细信息侧边栏的探测面板中,位于源代码标签页,允许您查看表达式的结果在程序生命周期中如何变化。您可以使用它来观察特定变量(例如
this
)的变化,或整个表达式(例如this.foo === "bar"
)的变化。
如果设置了任何操作,您还可以将URL 断点配置为评估后自动继续。这将使URL 断点实际上“不可见”,因为它永远不会暂停执行。“评估后自动继续”的URL 断点在图标中会有一个小的白色三角形(“空心”):
状态
URL 断点可以启用
- URL 断点被手动禁用
。单击(或右键单击并在上下文菜单中选择启用断点或禁用断点)导航侧边栏中任何断点图标,即可在启用 和禁用 之间切换,位于源代码标签页中。 - 断点已被全局禁用
。全局断点控件是一个按钮,它看起来就像一个断点,位于导航侧边栏顶部,在源代码标签页中。
右键单击任何URL 断点时,所有启用/禁用/删除切换选项都可在上下文菜单中找到。
图标图例
已启用(全局断点已启用) 已启用(全局断点已启用)并自动继续 已禁用(全局断点已启用) 已禁用(全局断点已启用)并自动继续 已启用(全局断点已禁用) 已启用(全局断点已禁用)并自动继续 已禁用(全局断点已禁用) 已禁用(全局断点已禁用)并自动继续