DIV CSS 佈局教程網

 DIV+CSS佈局教程網 >> 網頁腳本 >> JavaScript入門知識 >> JavaScript基礎知識 >> Javascript WebSocket使用實例介紹(簡明入門教程)
Javascript WebSocket使用實例介紹(簡明入門教程)
編輯:JavaScript基礎知識     

一旦你了解了網絡套接字與WEB服務器的連接,你將可以從浏覽器發送數據到服務器並且可以接收由服務器返回的響應數據。

以下是創建一個新的WebSocket對象的API:

復制代碼 代碼如下:var Socket = new WebSocket(url, [protocal] );

這裡第一個參數是指要連接的URL,第二個參數是可選的,如果需要的話,則是指定一個的服務器支持的協議。

WEB Socket屬性:

屬性 說明 Socket.readyState readyState的代表的ReadOnly屬性的連接狀態。它可以有以下值:
  1. 一個0值表示該連接尚未建立。

  2. 值為1表示連接建立和溝通是可能的。

  3. 值為2表示連接是通過將結束握手。

  4. 值為3表示連接已關閉或無法打開。

Socket.bufferedAmount 讀屬性的bufferedAmount代表文本的字節數,utf - 8的排隊使用send()方法。

WEB Socket事件:

事件 處理程序 說明 open Socket.onopen 此事件發生在套接字建立連接。 message Socket.onmessage 此事件發生時,客戶端收到來自服務器的數據。 error Socket.onerror 此事件發生時有任何通信錯誤。 close Socket.onclose 此事件發生在連接關閉。

WEB Socket方法:

方法 說明 Socket.send() send(data)方法用來連接傳輸數據。 Socket.close() close()方法將被用於終止任何現有的連接。


WEB Socket例子:

復制代碼 代碼如下:
<!DOCTYPE HTML>
<html>
<head>
<script type="text/javascript">
function WebSocketTest()
{
  if ("WebSocket" in window)
  {
     alert("WebSocket is supported by your Browser!");
     // Let us open a web socket
     var ws = new WebSocket("ws://localhost:9998/echo");
     ws.onopen = function()
     {
        // Web Socket is connected, send data using send()
        ws.send("Message to send");
        alert("Message is sent...");
     };
     ws.onmessage = function (evt)
     {
        var received_msg = evt.data;
        alert("Message is received...");
     };
     ws.onclose = function()
     {
        // websocket is closed.
        alert("Connection is closed...");
     };
  }
  else
  {
     // The browser doesn't support WebSocket
     alert("WebSocket NOT supported by your Browser!");
  }
}
</script>
</head>
<body>
<div id="sse">
   <a href="javascript:WebSocketTest()">Run WebSocket</a>
</div>
</body>
</html>

XML學習教程| jQuery入門知識| AJAX入門| Dreamweaver教程| Fireworks入門知識| SEO技巧| SEO優化集錦|
Copyright © DIV+CSS佈局教程網 All Rights Reserved