You can not select more than 25 topics Topics must start with a letter or number, can include dashes ('-') and can be up to 35 characters long.

77 lines
2.2 KiB

3 years ago
<!doctype html>
<style>
textarea { vertical-align: bottom; }
#output { overflow: auto; }
#output > p { overflow-wrap: break-word; }
#output span { color: blue; }
#output span.error { color: red; }
</style>
<h2>WebSocket Test</h2>
<textarea cols=60 rows=6></textarea>
<button>send</button>
<div id=output></div>
<script>
// http://www.websocket.org/echo.html
var button = document.querySelector("button"),
output = document.querySelector("#output"),
textarea = document.querySelector("textarea"),
// wsUri = "ws://echo.websocket.org/",
wsUri = "ws://127.0.0.1:5003/",
websocket = new WebSocket(wsUri);
button.addEventListener("click", onClickButton);
websocket.onopen = function (e) {
writeToScreen("CONNECTED");
doSend("WebSocket rocks");
};
websocket.onclose = function (e) {
writeToScreen("DISCONNECTED");
};
websocket.onmessage = function (e) {
writeToScreen("<span>RESPONSE: " + e.data + "</span>");
};
websocket.onerror = function (e) {
writeToScreen("<span class=error>ERROR:</span> " + e.data);
};
function doSend(message) {
writeToScreen("SENT: " + message);
websocket.send(message);
}
function writeToScreen(message) {
output.insertAdjacentHTML("afterbegin", "<p>" + message + "</p>");
}
function onClickButton() {
var text = textarea.value;
text && doSend(text);
textarea.value = "";
textarea.focus();
}
</script>
<body>
<h4>websocket 调用:<br/></h4>
<h5>
//弹出单一窗体显示,下一个视频代替前一个<br/>
{"topic":"Show_Single_Video","msg":"192.168.1.65"}<br/>
//主窗体显示<br/>
{"topic":"MainFrom_Show_Video","msg":"192.168.1.65"}<br/></h5>
<h4>
ZMQ 发送消息<br/>
</h4>
<h5>
//弹出单一窗体显示,下一个视频代替前一个<br/>
"topic":"Show_Single_Video","msg":"192.168.1.65"<br/>
//主窗体显示<br/>
"topic":"MainFrom_Show_Video","msg":"192.168.1.65"<br/>
//预警<br/>
"topic":"Warning_Show_Video","msg":"192.168.1.65"<br/></h5>
</body>