35 lines
1.2 KiB
HTML
35 lines
1.2 KiB
HTML
|
<!DOCTYPE html>
|
||
|
|
<html lang="en">
|
||
|
|
<head>
|
||
|
|
<meta charset="UTF-8">
|
||
|
|
<title>我的SwooleWebSocket主页</title>
|
||
|
|
</head>
|
||
|
|
<body>
|
||
|
|
<h1>Hello Swoole WebSocket.</h1>
|
||
|
|
<div id="append"></div>
|
||
|
|
</body>
|
||
|
|
<script>
|
||
|
|
var webSocket = new WebSocket('ws://www.cimeisi.cn:8080');
|
||
|
|
|
||
|
|
// 流程跟服务端相同，监听握手成功，监听服务端发送消息，监听关闭，同时多了一个监听失败
|
||
|
|
webSocket.onopen = function (evt) {
|
||
|
|
// 给服务端发送消息
|
||
|
|
webSocket.send("Hello, my name is neo.");
|
||
|
|
window.document.getElementById("append").insertAdjacentHTML("beforeend", "<h3>connected-swoole-success</h3>");
|
||
|
|
}
|
||
|
|
|
||
|
|
webSocket.onmessage = function (evt) {
|
||
|
|
const html = "<h3>" + evt.data + "</h3>";
|
||
|
|
window.document.getElementById("append").insertAdjacentHTML("beforeend", html);
|
||
|
|
}
|
||
|
|
|
||
|
|
webSocket.onclose = function (evt) {
|
||
|
|
window.document.getElementById("append").insertAdjacentHTML("beforeend", "<h3>closed</h3>");
|
||
|
|
}
|
||
|
|
|
||
|
|
webSocket.onerror = function (evt, e) {
|
||
|
|
const html = "<h3><font color='red'>" + evt.data + "</font></h3>";
|
||
|
|
window.document.getElementById("append").insertAdjacentHTML("beforeend", html);
|
||
|
|
}
|
||
|
|
</script>
|
||
|
|
</html>
|