| 123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778798081828384858687888990919293949596979899100101102103104105106107108109110111112113114115116117118119120121122123124125126127128129130131132133134135136137138139140141142143144145 |
- <html>
- <head>
- <title>WebSockets Echo Test</title>
- </head>
- <body>
- Host: <input id='host' style='width:100'>
- Port: <input id='port' style='width:50'>
- Encrypt: <input id='encrypt' type='checkbox'>
- <input id='connectButton' type='button' value='Start' style='width:100px'
- onclick="connect();">
- <br>
- Log:<br>
- <textarea id="messages" style="font-size: 9;" cols=80 rows=25></textarea>
- </body>
- <script>
- var ws, host = null, port = null,
- msg_cnt = 0, send_cnt = 1, echoDelay = 500,
- echo_ref;
- function message(str) {
- console.log(str);
- cell = document.getElementById('messages');
- cell.innerHTML += msg_cnt + ": " + str + "\n";
- cell.scrollTop = cell.scrollHeight;
- msg_cnt++;
- }
- Array.prototype.pushStr = function (str) {
- var n = str.length;
- for (var i=0; i < n; i++) {
- this.push(str.charCodeAt(i));
- }
- }
- function send_msg() {
- if (ws.bufferedAmount > 0) {
- console.log("Delaying send");
- return;
- }
- var str = "Message #" + send_cnt, arr = [];
- var encoder = new TextEncoder();
- ws.send(encoder.encode(str));
- message("Sent message: '" + str + "'");
- send_cnt++;
- }
- function update_stats() {
- document.getElementById('sent').innerHTML = sent;
- document.getElementById('received').innerHTML = received;
- document.getElementById('errors').innerHTML = errors;
- }
- function init_ws() {
- console.log(">> init_ws");
- console.log("<< init_ws");
- }
- function connect() {
- var host = document.getElementById('host').value,
- port = document.getElementById('port').value,
- scheme = "ws://", uri;
- console.log(">> connect");
- if ((!host) || (!port)) {
- console.log("must set host and port");
- return;
- }
- if (ws) {
- ws.close();
- }
- if (document.getElementById('encrypt').checked) {
- scheme = "wss://";
- }
- uri = scheme + host + ":" + port;
- message("connecting to " + uri);
- ws = new WebSocket(uri);
- ws.binaryType = 'arraybuffer';
- ws.addEventListener('message', function(e) {
- //console.log(">> WebSockets.onmessage");
- var decoder = new TextDecoder('UTF-8');
- var str = decoder.decode(e.data);
- message("Received message '" + str + "'");
- //console.log("<< WebSockets.onmessage");
- });
- ws.addEventListener('open', function(e) {
- console.log(">> WebSockets.onopen");
- echo_ref = setInterval(send_msg, echoDelay);
- console.log("<< WebSockets.onopen");
- });
- ws.addEventListener('close', function(e) {
- console.log(">> WebSockets.onclose");
- if (echo_ref) {
- clearInterval(echo_ref);
- echo_ref = null;
- }
- console.log("<< WebSockets.onclose");
- });
- ws.addEventListener('error', function(e) {
- console.log(">> WebSockets.onerror");
- if (echo_ref) {
- clearInterval(echo_ref);
- echo_ref = null;
- }
- console.log("<< WebSockets.onerror");
- });
- document.getElementById('connectButton').value = "Stop";
- document.getElementById('connectButton').onclick = disconnect;
- console.log("<< connect");
- }
- function disconnect() {
- console.log(">> disconnect");
- if (ws) {
- ws.close();
- }
- if (echo_ref) {
- clearInterval(echo_ref);
- }
- document.getElementById('connectButton').value = "Start";
- document.getElementById('connectButton').onclick = connect;
- console.log("<< disconnect");
- }
- window.onload = function() {
- console.log("onload");
- var url = document.location.href;
- document.getElementById('host').value = (url.match(/host=([^&#]*)/) || ['',window.location.hostname])[1];
- document.getElementById('port').value = (url.match(/port=([^&#]*)/) || ['',window.location.port])[1];
- }
- </script>
- </html>
|