从 Chrome 扩展程序访问 Websocket 流量

Question

有一个页面（游戏），它通过WebSocket与服务器通信。我可以在 Chrome 开发者工具中看到数据（帧）。是否可以从chrom扩展名访问/修改此通信？

Answer 1

目前，访问或修改 Websocket 流量的唯一方法是使用内容脚本注入一个脚本，该脚本将WebSocket构造函数替换为您自己的包装器。此包装器的行为应类似于原始 WebSocket 实现，但您可以添加更多内容，例如将发送/接收的消息记录到扩展。

为了防止站点中断，您必须确保您的WebSocket包装器完全符合标准。必须实现的接口记录在 http://www.whatwg.org/specs/web-apps/current-work/multipage/network.html#the-websocket-interface。

有关如何包装 DOM 构造函数的灵感，请参阅例如我的包装器Worker。您可以自由地重用部分代码（例如EventTarget接口的实现，这也是WebSocket API 的要求）。

更多强调：确保您的实现遵循标准 WebSocket API 的接口，否则您可能会破坏某些站点！

Answer 2

似乎该错误已修复且可用。在 manifest.json 中，您需要显式指定权限

{
  ...
  "permissions": ["webRequest", "ws://*/*", "wss://*/*"]
  ...
}

在网络过滤器中，应将其指定为 Websocket 请求。

const networkFilters = {
    urls: [
        "wss://echo.websocket.org/*"
    ]
};
chrome.webRequest.onBeforeRequest.addListener((details) => {
    const { tabId, requestId } = details;
    // do stuff here
}, networkFilters);

Answer 3

有一个 WebSocket-Wrapper，你可以用它来访问 WebSocket 流量：

https://github.com/gorhill/chromium-websocket-wrapper/blob/master/chromium-websocket-wrapper.js

Answer 4

从对这个bug的讨论来看，目前没有API来拦截WebSocket流量，不像普通的请求有chrome.webRequest。它已分配，但尚未完成。

编辑：最近（截至2016年11月）关于该错误的活动表明补丁正在进行中。

Answer 5

我遇到了这个问题并尝试了上面的解决方案，不幸的是，我的目标站点中的脚本仍然发现 WebSocket 已被篡改和破坏，这很糟糕。

所以我想出了自己的解决方案：

var ws = window.WebSocket;
window.WebSocket = function(a,b){
var ret = new ws(a,b);
let handle = setInterval(function(){
                  if(ret.onmessage){
                     clearInterval(handle);
                     let o = ret.onmessage;
                     ret.onmessage = function(m){
                                       //do what your want to m
                                       o(m);
                                     };
                   }
                   },50);
                   return ret;
              }

如果您要检查的站点确实使用了 WebSocket，我肯定会在创建 WebSocket 对象后的某个时候分配给onmessage，只需定期检查它并使用您自己的函数重新分配它。