examples/websockets/echoserver/echoclient.html

   1 <html>
   2     <head>
   3         <title>WebSocket Echo Client</title>
   4     </head>
   5     <body>
   6         <h1>WebSocket Echo Client</h1>
   7         <p>
   8             <button onClick="initWebSocket();">Connect</button>
   9             <button onClick="stopWebSocket();">Disconnect</button>
  10             <button onClick="checkSocket();">State</button>
  11         </p>
  12         <p>
  13             <textarea id="debugTextArea" style="width:400px;height:200px;"></textarea>
  14         </p>
  15         <p>
  16             <input type="text" id="inputText" onkeydown="if(event.keyCode==13)sendMessage();"/>
  17             <button onClick="sendMessage();">Send</button>
  18         </p>
  19
  20         <script type="text/javascript">
  21             var debugTextArea = document.getElementById("debugTextArea");
  22             function debug(message) {
  23                 debugTextArea.value += message + "\n";
  24                 debugTextArea.scrollTop = debugTextArea.scrollHeight;
  25             }
  26
  27             function sendMessage() {
  28                 var msg = document.getElementById("inputText").value;
  29                 if ( websocket != null )
  30                 {
  31                     document.getElementById("inputText").value = "";
  32                     websocket.send( msg );
  33                     console.log( "string sent :", '"'+msg+'"' );
  34                 }
  35             }
  36
  37             var wsUri = "ws://localhost:1234";
  38             var websocket = null;
  39
  40             function initWebSocket() {
  41                 try {
  42                     if (typeof MozWebSocket == 'function')
  43                         WebSocket = MozWebSocket;
  44                     if ( websocket && websocket.readyState == 1 )
  45                         websocket.close();
  46                     websocket = new WebSocket( wsUri );
  47                     websocket.onopen = function (evt) {
  48                         debug("CONNECTED");
  49                     };
  50                     websocket.onclose = function (evt) {
  51                         debug("DISCONNECTED");
  52                     };
  53                     websocket.onmessage = function (evt) {
  54                         console.log( "Message received :", evt.data );
  55                         debug( evt.data );
  56                     };
  57                     websocket.onerror = function (evt) {
  58                         debug('ERROR: ' + evt.data);
  59                     };
  60                 } catch (exception) {
  61                     debug('ERROR: ' + exception);
  62                 }
  63             }
  64
  65             function stopWebSocket() {
  66                 if (websocket)
  67                     websocket.close();
  68             }
  69
  70             function checkSocket() {
  71                 if (websocket != null) {
  72                     var stateStr;
  73                     switch (websocket.readyState) {
  74                         case 0: {
  75                             stateStr = "CONNECTING";
  76                             break;
  77                         }
  78                         case 1: {
  79                             stateStr = "OPEN";
  80                             break;
  81                         }
  82                         case 2: {
  83                             stateStr = "CLOSING";
  84                             break;
  85                         }
  86                         case 3: {
  87                             stateStr = "CLOSED";
  88                             break;
  89                         }
  90                         default: {
  91                             stateStr = "UNKNOW";
  92                             break;
  93                         }
  94                     }
  95                     debug("WebSocket state = " + websocket.readyState + " ( " + stateStr + " )");
  96                 } else {
  97                     debug("WebSocket is null");
  98                 }
  99             }
 100         </script>
 101     </body>
 102 </html>