如何在Chrome Dev Tools中显示精确时间？

Question

在此链接中，介绍了如何使用网络计时面板/窗口。但是，我发现计时是相对的：这里没有“精确时间”。例如，我想查看ajax开始和结束的确切时间。这应该是我需要在此面板中查看的字符串，作为ajax请求的“精确开始时间”（链接）。

在Chrome开发者工具中，如何实现这一点？是否有任何地方记录了网络事件的确切日期时间？

- rebulanyum

---

如果您想在未来的Chrome版本中看到此功能，请给功能请求点赞。 - mareolan

Answer 1

并不一定是您要求的内容，但是由于您询问了任何网络事件的确切日期，因此可以捕获响应日期（响应消息发出的时间）。如果您右键单击其中一列，然后选择“响应标头”->“管理标头列”->“添加自定义标头”->（输入日期）。不幸的是，它并不是请求的实际开始日期。我不知道除了修改代码以记录您的开始日期之外，是否有一种在开发工具中捕获它的方法。

- xhermit

---

是的，我知道我们可以获取响应日期，但不确定是否有办法获取请求日期。这很奇怪，不是吗？ - rebulanyum

没错。这似乎是谷歌可以轻松捕捉的简单指标。 - xhermit

【2023更新】在最新的Chrome版本中（截至本文撰写时的版本为114.0.5735.198），在"响应头"下没有列出"日期"字段。我不得不通过选择"管理标题列" > "添加自定义标题..."手动添加它，然后键入"日期"。之后，它立即出现在列的列表中。 - informatik01

Answer 2

我进入了控制台并进行了XMLHttpRequest的猴子补丁，如下所示：

const original = window.XMLHttpRequest.prototype.open;
window.XMLHttpRequest.prototype.open = function( ) {
    console.log(new Date().toISOString(), arguments);
    return original.apply(this, [].slice.call(arguments));
};

对我有效。

2022-11-17T19:20:26.013Z Arguments(3) ['POST', 'http://localhost:7450/realms/CLIENTID/protocol/openid-connect/token', true, callee: ƒ, Symbol(Symbol.iterator): ƒ]
2022-11-17T19:21:26.286Z Arguments(3) ['POST', 'http://localhost:7450/realms/CLIENTID/protocol/openid-connect/token', true, callee: ƒ, Symbol(Symbol.iterator): ƒ]

我认为如果需要的话，也可以对fetch进行猴子补丁。

- Ron Newcomb