wstest.html 2.1 KB

123456789101112131415161718192021222324252627282930313233343536373839404142434445464748495051525354555657585960616263646566676869707172737475767778
  1. <!DOCTYPE html>
  2. <html>
  3. <head>
  4. <meta charset="utf-8" />
  5. <title>MicroWebSocket Test</title>
  6. </head>
  7. <script language="javascript">
  8. var output;
  9. function init()
  10. {
  11. output = document.getElementById("output");
  12. testWebSocket();
  13. }
  14. function testWebSocket()
  15. {
  16. var wsUri = "ws://" + window.location.hostname;
  17. writeToScreen("Connection to " + wsUri + "...")
  18. websocket = new WebSocket(wsUri);
  19. websocket.onopen = function(evt) { onOpen (evt) };
  20. websocket.onclose = function(evt) { onClose (evt) };
  21. websocket.onmessage = function(evt) { onMessage (evt) };
  22. websocket.onerror = function(evt) { onError (evt) };
  23. }
  24. function onOpen(evt)
  25. {
  26. writeToScreen("<strong>-- CONNECTED --</strong>");
  27. SendMsg("Hello world :)");
  28. SendMsg("This is a WebSocket test");
  29. SendMsg("(with a text frame encoded in UTF-8)");
  30. setTimeout( function() { websocket.close() }, 500 )
  31. }
  32. function onClose(evt)
  33. {
  34. writeToScreen("<strong>-- DISCONNECTED --</strong>");
  35. }
  36. function onMessage(evt)
  37. {
  38. writeToScreen('MSG FROM SERVER : <span style="color: blue;">' + evt.data + '</span>');
  39. }
  40. function onError(evt)
  41. {
  42. writeToScreen('ERROR : <span style="color: red;">' + evt.data + '</span>');
  43. }
  44. function SendMsg(msg)
  45. {
  46. writeToScreen('MSG TO SERVER : <span style="color: green;">' + msg + '</span>');
  47. websocket.send(msg);
  48. }
  49. function writeToScreen(s)
  50. {
  51. var pre = document.createElement("p");
  52. pre.style.wordWrap = "break-word";
  53. pre.innerHTML = s;
  54. output.appendChild(pre);
  55. }
  56. window.addEventListener("load", init, false);
  57. </script>
  58. <body>
  59. <h2>MicroWebSocket Test :</h2>
  60. <div id="output"></div>
  61. </body>
  62. </html>