通过原型监听WebSocket连接

Listening to a WebSocket connection through prototypes

本文关键字:WebSocket 连接 监听 原型      更新时间:2023-09-26

我在这个问题上花了几个星期的时间,似乎找不到解决方案。这是一个用例。我正在开发一个chrome扩展,这个扩展的主要目的之一是检测WebSocket何时打开或关闭。我看过WebSockets的HTML5规范,它们公开了以下相关的方法/事件:

WebSocket.prototype.readyState = 0;
WebSocket.prototype.onopen = 0;
WebSocket.prototype.onerror = 0;
WebSocket.prototype.onclose = 0;
function WebSocket(url,protocols) {}
WebSocket.prototype.close = function(code,reason) {};

由于我无法从扩展中访问单个实例,所以我必须依靠包装这些原型来确定它们何时被调用。例如:

WebSocket.prototype.close = function (close) {
    console.log("Closing socket....");
    return function (code, reason) {
        return close.apply(this, arguments);
    };
}(WebSocket.prototype.close);

然而,我真正想做的是以某种方式包装或注册onopen、oneror或onclose的侦听器。不幸的是,我不知道该怎么做。我尝试了很多不同的方法。上面的方法适用于"关闭",但他们不提供"打开",这是我所依赖的。最有希望的想法,但没有起作用,是如下:

WebSocket.prototype.constructor = function (constructor) {
    debugger;
    console.log("Register all my events here!");
    constructor.apply(this, arguments);
}(WebSocket.prototype.constructor);

不幸的是,我从来没能碰到断点,也没能看到控制台日志,这让我觉得自己做错了什么。

作为最后的手段,我试着玩Object.Observe(),但无法观察到原型:

Object.observe(WebSocket.prototype.readyState, function (changes) {
    console.log("Ready state");
});
Object.observe(WebSocket.prototype.onopen, function (changes) {
    console.log("On open");
});

所以,总而言之,我尝试了几种不同的方法,但最终还是碰壁了。最后,我的目标是通过监听任何公开的方法或事件来检测WebSocket何时打开或关闭。如有任何帮助,我们将不胜感激。

更新:这是一个小提琴,包括以下建议:

http://jsfiddle.net/s35zpfq9/1/

谢谢!

您可以包装WebSocket来监视切换后创建的所有实例:

(function(){
var ws = window.WebSocket;
window.WebSocket = function (a, b) {
   var that = b ? new ws(a, b) : new ws(a);
   that.addEventListener("open", console.info.bind(console, "socket open"));
   that.addEventListener("close", console.info.bind(console, "socket close"));
   that.addEventListener("message", console.info.bind(console, "socket msg"));
   return that;
};
window.WebSocket.prototype=ws.prototype; 
}());