如何在运行请求完成之前中断XMLHttpRequest事件并编辑调用的参数

Question

使用谷歌浏览器，我想在触发指定的XMLHttpRequest事件之前中断，以便操纵其参数数据。

到目前为止，我设法打破了一个XHR调用事件，但我无法弄清楚如何在它被触发并发送到服务器之前操纵调用的输入 - 我的主要目标是操纵/更改请求的参数。

以下是使用Chrome DevTools的当前工作的快照：

任何帮助都会得到满足！

Answer 1

您是否在来源面板上尝试了 XHR断点功能？我很确定在请求发出之前会中断。从那里，您可以检查和操作控制台中的数据。

您可以在上面的屏幕截图右侧看到该窗格。

在XHR上设置断点的另一种方法是从“事件侦听器断点”窗格。从这里，您可以在XHR生命周期的各个阶段触发断点。

以下面的小提琴为例：https://jsfiddle.net/kaycebasques/jdf20gn4/1/

var xhr = new XMLHttpRequest();
var params = {"a": 1, "b": 2};
xhr.open('GET', 'https://httpbin.org/get');
xhr.send(params);

我按 XHR Breakpoints 旁边的加号，然后按Enter，创建了“Any XHR”断点。

当断点暂停时，您可以在范围窗格中的 XHR断点上方看到当前定义的变量。

要修改XHR数据，只需在“范围”窗格中找到您要查找的变量，然后使用控制台修改该变量。