您可以记录从服务器发送到客户端的 Websocket 请求吗？

Question

我正在创建一个 Chrome 扩展程序，它将 JavaScript 代码注入到我的网站中，以记录用户在运行扩展程序时收到的 WebSocket 请求。

假设我已连接到我网站上的 WebSocket 服务器（位于

wss://server.example.com

），它会将数据发送到我的客户端，如

{"message": "example"}

。

我不想创建新的连接来记录；相反，我想记录连接到该站点时自动建立的连接。

因此，做类似

const ws = new WebSocket('wss://server.example.com');

之类的事情并记录它发送的请求并不是我想要实现的目标。我想记录当您连接到具有 WebSocket 服务器的站点时自动建立的连接的请求。

如果我找到一段有效的代码，我是否应该能够将其放入控制台来检查它是否有效？

我尝试使用不同的脚本与

const OriginalWebSocket = window.WebSocket;

创建 WebSocket 连接的副本并自己将它们记录在脚本中。然而，它经常返回未定义的结果。有谁知道我如何记录请求？

Answer 1

这将拦截并记录页面发出的所有 WebSocket 连接和消息。

const OriginalWebSocket = window.WebSocket;

window.WebSocket = function(url, protocols) {
  const ws = new OriginalWebSocket(url, protocols);

  ws.addEventListener('open', (event) => {
    console.log('WebSocket connection opened:', url);
  });

  ws.addEventListener('message', (event) => {
    console.log('Received WebSocket message:', event.data);
  });

  ws.addEventListener('close', (event) => {
    console.log('WebSocket connection closed');
  });

  ws.addEventListener('error', (event) => {
    console.error('WebSocket error:', event);
  });

  return ws;
};