WebSocket是一种在Web浏览器和服务器之间建立长连接的协议。但在使用WebSocket时，开发者需要注意关闭WebSocket的正确方式，否则可能会导致资源泄露或其他问题。
关闭WebSocket的常见错误姿势
直接调用close()
在WebSocket对象上直接调用close()方法，即可关闭WebSocket连接。例如：
socket.close();
然而，在实际运行中，该方法可能会存在多个问题。比如：
- 如果在创建WebSocket对象后，还未成功建立与服务器的连接，此时调用
close()方法将不会关闭连接。 - 如果WebSocket对象已经处于关闭状态，再次调用
close()方法将会抛出异常。 - 如果WebSocket对象正在关闭过程中，再次调用
close()方法可能会导致错误。
因此，在实际开发中，我们需要采取更为稳妥的方式来关闭WebSocket连接。
直接断开WebSocket连接
有些开发者可能会选择直接断开WebSocket连接，例如通过修改网络设置或断电等方式。这种做法是非常不可取的，因为它没有执行WebSocket关闭握手，可能会导致服务器端资源泄漏或者其他问题。
正确关闭WebSocket的方法
在onclose回调函数内关闭WebSocket
WebSocket支持onclose事件回调函数，当WebSocket连接关闭时自动执行该函数。因此，我们可以在该函数内部主动关闭WebSocket连接。例如：
socket.onclose = function(event) {
console.log('WebSocket closed with code: ' + event.code);
socket = null;
};注意，在onclose()回调函数内部，我们需要将WebSocket对象的引用设置为null，以便垃圾回收机制可以释放WebSocket对象占用的内存。
关闭WebSocket前先发送一个关闭帧
WebSocket关闭握手包括两个步骤：客户端发送一个关闭帧，服务器端接收到该帧后才关闭连接。因此，在关闭WebSocket连接之前，我们应该先发送一个关闭帧，确保服务器端能够正常地关闭连接。
在JavaScript中，我们可以使用send()方法发送一个关闭帧。例如：
socket.onclose = function(event) {
if (event.wasClean) {
console.log('WebSocket closed cleanly');
} else {
console.error('WebSocket closed uncleanly');
}
socket.send('');
};在发送关闭帧之后，WebSocket对象会自动进入关闭过程，并触发onclose事件。如果服务器端正确地关闭了WebSocket连接，则事件对象的wasClean属性值为true。否则，其值为false。
示例代码
下面是一个完整的WebSocket关闭示例代码：
-- -------------------- ---- -------
--- ------ - --- ---------------------------------
------------- - ---------- -
---------------------- ---------
--
---------------- - --------------- -
--------------------- -------- - - ------------
--
-------------- - --------------- -
-- ---------------- -
---------------------- ------ ----------
- ---- -
------------------------ ------ ------------
-
----------------
------ - -----
--
-------- ---------------- -
-- -------- -
---------------
------ - -----
-
-在该示例代码中，我们定义了一个closeWebSocket()函数来关闭WebSocket连接。该函数首先使用socket.close()方法关闭WebSocket连接，然后将WebSocket对象的引用设置为null。在onclose()回调函数内，我们发送一个空白的消息帧，确保服务器端正确地关闭WebSocket连接。
来源：JavaScript中文网 ，转载请注明来源 https://www.javascriptcn.com/post/11026
