<!DOCTYPE html>
<html>
<head>
<title>Testing websockets</title>
</head>
<body>
<div>
<input id="user" type="text">
<input type="submit" value="Close" onclick="OnClose()" />
<input type="submit" value="Start" onclick="start()" />
<img id="video" src="" width="100px" height="100px">
<img id="video1" src="" width="100px" height="100px">
</div>
<div id="messages"></div>
<script type="text/javascript">
var webSocket = new WebSocket('ws://192.168.1.203:45000');
//webSocket.binaryType = "arraybuffer";
console.log(webSocket.ip)
webSocket.onerror = function(event) {
onError(event)
};
webSocket.onopen = function(event) {
onOpen(event)
};
webSocket.onclose = function(event) {
onClose(event)
};
webSocket.onmessage = function(e) {
var data =e.data; //json字符串
var obj = JSON.parse(data);
document.getElementById('video').src=obj[0].Image;
document.getElementById('video1').src=obj[1].Image;
console.log(obj[0].video);
};
function onMessage(e) {
}
function onOpen(event) {
document.getElementById('messages').innerHTML
= 'Connection established';
}
function onClose(event) {
document.getElementById('messages').innerHTML
+= '<br />disconnection';
}
function onError(event) {
alert(event.data);
}
function OnClose() {
webSocket.send($("#user").val());
return false;
}
function start() {
webSocket.send('25');
return false;
}
</script>
</body>
</html>