WebSockets - 处理错误
一旦在客户端和服务器之间建立连接，就会从 Web Socket 实例触发 open 事件。 错误是由于通信过程中发生的错误而产生的。 它是借助 onerror 事件进行标记的。 Onerror 后始终会终止连接。
当通信之间发生错误时，会触发 onerror 事件。 onerror 事件之后是连接终止，这是一个 close 事件。
一个好的做法是始终通知用户意外错误并尝试重新连接它们。
socket.onclose = function(event) {
console.log("Error occurred.");
// Inform the user about the error.
var label = document.getElementById("status-label");
label.innerHTML = "Error: " + event;
}
当涉及到错误处理时，您必须同时考虑内部和外部参数。
内部参数包括由于代码中的错误或意外的用户行为而可能生成的错误。
外部错误与应用程序无关； 相反，它们与无法控制的参数有关。 最重要的是网络连接。
任何交互式双向 Web 应用程序都需要有效的互联网连接。
检查网络可用性
想象一下，您的用户正在享受您的网络应用程序，但网络连接在他们执行任务的过程中突然变得无响应。 在现代本机桌面和移动应用程序中，检查网络可用性是一项常见任务。
最常见的方法是向应该启动的网站（例如，http://www.google.com）发出 HTTP 请求。 如果请求成功，桌面或移动设备就知道存在活动连接。 同样，HTML 有 XMLHttpRequest 用于确定网络可用性。
然而，HTML5 让它变得更加容易，并引入了一种检查浏览器是否可以接受网络响应的方法。 这是通过导航器对象实现的 −
if (navigator.onLine) {
alert("You are Online");
}else {
alert("You are Offline");
}
离线模式意味着设备未连接或用户已从浏览器工具栏选择离线模式。
下面介绍如何在发生 WebSocket 关闭事件时通知用户网络不可用并尝试重新连接 −
socket.onclose = function (event) {
// Connection closed.
// Firstly, check the reason.
if (event.code != 1000) {
// Error code 1000 means that the connection was closed normally.
// Try to reconnect.
if (!navigator.onLine) {
alert("You are offline. Please connect to the Internet and try again.");
}
}
}
接收错误消息的演示
以下程序解释了如何使用 Web Sockets 显示错误消息 −
<!DOCTYPE html>
<html>
<meta charset = "utf-8" />
<title>WebSocket Test</title>
<script language = "javascript" type = "text/javascript">
var wsUri = "ws://echo.websocket.org/";
var output;
function init() {
output = document.getElementById("output");
testWebSocket();
}
function testWebSocket() {
websocket = new WebSocket(wsUri);
websocket.onopen = function(evt) {
onOpen(evt)
};
websocket.onclose = function(evt) {
onClose(evt)
};
websocket.onerror = function(evt) {
onError(evt)
};
}
function onOpen(evt) {
writeToScreen("CONNECTED");
doSend("WebSocket rocks");
}
function onClose(evt) {
writeToScreen("DISCONNECTED");
}
function onError(evt) {
writeToScreen('<span style = "color: red;">ERROR:</span> ' + evt.data);
}
function doSend(message) {
writeToScreen("SENT: " + message); websocket.send(message);
}
function writeToScreen(message) {
var pre = document.createElement("p");
pre.style.wordWrap = "break-word";
pre.innerHTML = message; output.appendChild(pre);
}
window.addEventListener("load", init, false);
</script>
<h2>WebSocket Test</h2>
<div id = "output"></div>
</html>
输出如下 −
