如何正确关闭 websocket

Posted 2023-02-16

【中文标题】如何正确关闭 websocket

【英文标题】：How to properly close websockets

【发布时间】：2017-09-20 15:50:29

【问题描述】：

我正在构建一个连接到 websocket 并检索数据的 Chrome 扩展程序。我正在尝试构建一种方式，让用户从 popup.html 中选择一个选项，并将其更改为将建立连接的 websocket。这工作正常。

我的问题是，在选择一个选项后，新连接会与该 websocket 建立连接，但前一个连接会不断返回数据。我想在打开新连接之前关闭之前的连接。

popup.js（单选按钮更改存储新值）

$(function() 
        $("input:radio[name=exc]").change(function() 
            chrome.storage.local.set('checked':this.value, function() 
            );
        );
    );

update.js（接收新选择的单选按钮，我正在尝试关闭以前的 websocket）

chrome.storage.onChanged.addListener(function(changes, namespace) 
    chrome.storage.local.get("checked", function(data) 
        if(data.checked == "foo") 
            var ws = new WebSocket('wss://api.foo.com/ws');
            ws.onopen = function() 
                ws.send(JSON.stringify("event":"test", "channel":"test"));
            ;
            ws.onmessage = function(msg) 
                var price = response[7];
                if(hb != "hb" && typeof hb != 'undefined') 
                    price = price.toString();
                    chrome.extension.sendMessage(price);
                
            ;
            ws.close();
        
        else if(data.checked == "bar") 
            var pusher = new Pusher('xxxxxxxxxxxxx');
            var tradesChannel = pusher.subscribe('test'),
            child = null;
            tradesChannel.bind('test', function (data) 
                var price = data.price;
                if(typeof data.price != 'undefined') 
                    price = price.toString();
                    chrome.extension.sendMessage(price);
                
            );
            pusher.disconnect();
         
    );
);

如果我按原样保留代码，我会收到 WebSocket connection to 'wss://api.foo.com/ws' failed: WebSocket is closed before the connection is established. 并且没有收到任何数据。

【参考方案1】：

您目前的代码没有意义；设置新服务后立即致电close/disconnect。

此外，您会丢失对推送服务的引用，因为它仅存储在局部变量中。这需要作为状态存储在某个地方 - 全局状态很容易，但也许你可以更好地设计它。

一个简单的解决方案如下所示：

var ws; // We need it later, can't be a local variable

/* ... */
    if(data.checked == "foo") 
        if(ws)  ws.close(); ws = null; 
        ws = new WebSocket('wss://api.foo.com/ws');
        ws.onopen = function() 
            ws.send(JSON.stringify("event":"test", "channel":"test"));
        ;
        ws.onmessage = function(msg) 
            var price = response[7];
            if(hb != "hb" && typeof hb != 'undefined') 
                price = price.toString();
                chrome.extension.sendMessage(price);
            
        ;
        // Don't close the new one here
    

【参考方案2】：

在官方 WebSocket MDN 文档中有一个close() method：

关闭() 关闭 WebSocket 连接或连接尝试（如果有）。如果连接已关闭，则此方法不执行任何操作。

void close(
  in optional unsigned short code,
  in optional DOMString reason
);

另外，请确保您在正确的端口上。更多来自SO post。