正确关闭WebSocket（HTML5、Javascript）

我正在玩HTML5WebSocket。我在想，如何才能优雅地关闭连接？比如，如果用户刷新页面，或者只是关闭浏览器，会发生什么

---

当用户只刷新页面而不调用

websocket.close（）

时，会出现一种奇怪的行为-当他们在刷新后返回时，它将命中

websocket.onclose

事件。

非常简单，关闭它：）

您是否也检查了，并根据v76（当前支持的浏览器所实现的版本）检查了

：

要干净地关闭连接，只包含0xFF字节的帧 后跟一个0x00字节，从一个对等方发送，以请求另一个对等方 关闭连接

如果正在编写服务器，则应确保在服务器关闭客户端连接时发送关闭帧。正常的TCP套接字关闭方法有时会很慢，导致应用程序认为连接仍然打开，即使它没有打开

当您关闭或重新加载页面时，浏览器应该真正为您做到这一点。但是，您可以通过捕获beforeunload事件来确保发送闭合帧：

window.onbeforeunload = function() {
    websocket.onclose = function () {}; // disable onclose handler first
    websocket.close();
};

---

我不确定刷新页面后如何获得onclose事件。页面重新加载后，websocket对象（带有onclose处理程序）将不再存在。如果您在页面加载时立即尝试在页面上建立WebSocket连接，则可能会遇到服务器在旧连接断开后很快拒绝新连接的问题（或者浏览器未准备好在您尝试连接的位置建立连接）您将获得新websocket对象的onclose事件。

问题是，目前使用的websocket有两个主要的协议版本。旧版本使用

[0x00][message][0xFF]

协议，新版本使用Hybi格式的数据包

Opera和iPod/iPad/iPhone使用旧的协议版本，因此在WebSockets服务器中实现向后兼容性实际上很重要。对于使用旧协议的浏览器，我发现刷新页面、离开页面或关闭浏览器都会导致浏览器自动关闭连接。太好了

---

但是，对于使用新协议版本的浏览器（如Firefox、Chrome和IE10），只有关闭浏览器才会导致浏览器自动关闭连接。也就是说，如果您刷新页面或导航离开页面，浏览器不会自动关闭连接。但是，浏览器所做的是向服务器发送一个hybi数据包，其中第一个字节（proto ident）为

0x88

（通常称为close数据帧）。一旦服务器收到此数据包，如果您选择，它可以强制关闭连接本身。

正如OBE所述，某些浏览器不会自动关闭WebSocket。不要试图在客户端处理任何“关闭浏览器窗口”事件。目前还没有可靠的方法来做，如果你考虑支持桌面“强”和“<强”>移动浏览器（例如，代码> OnBooFunEng/<代码>在移动Safari中将不起作用）。我在服务器端处理这个问题方面有很好的经验。例如，如果您使用Java EE，请查看，根据浏览器的不同，如果您关闭/重新加载浏览器窗口，将调用

OnClose

方法或

OnError

方法。

使用web套接字的close方法，您可以根据需要编写任何函数

var connection = new WebSocket('ws://127.0.0.1:1337');
    connection.onclose = () => {
            console.log('Web Socket Connection Closed');
        };

请用这个

var uri = "ws://localhost:5000/ws";
var socket = new WebSocket(uri);
socket.onclose = function (e){
    console.log(connection closed);
};
window.addEventListener("unload", function () {
    if(socket.readyState == WebSocket.OPEN)
        socket.close();
});

---

关闭浏览器不会触发websocket关闭事件。您必须手动调用socket.close（）。

在Firefox中，连接可能在下一页加载时挂起。我找不到参考资料，但我认为这可能是一个错误。另一种可能性是，当用户导航/页面重新加载时，

onclose

事件意外触发，或者可能是故意触发的。我已经问了预期的行为应该是什么，哪个浏览器有它的正确性以及我们如何实现自动重新连接。考虑到<代码> OnBoE预卸载< /COD>服务器端的实际例子，如何管理这个HEBI包？WebSocket变量在页面重新加载时被删除，因此，如果无法访问，为什么连接会保持打开状态？重复使用连接也没有意义。@albanx检查我下面的答案。有关如何从websocket客户端（即浏览器）发送关闭帧的代码示例。我正在使用ws-npm模块在我的案例中，连接在数据传输过程中关闭，它在Opera和iOS系列浏览器中运行良好。请帮帮我。。自从上两周以来，我一直在努力解决这个问题。

var uri = "ws://localhost:5000/ws";
var socket = new WebSocket(uri);
socket.onclose = function (e){
    console.log(connection closed);
};
window.addEventListener("unload", function () {
    if(socket.readyState == WebSocket.OPEN)
        socket.close();
});