html5 WebSocket

来源：互联网发布：网络经典小说排行榜编辑：程序博客网时间：2024/06/05 02:30

WebSocket介绍

WebSocket是HTML5开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。
在WebSocket API中，浏览器和服务器只需要做一个握手的动作，然后，浏览器和服务器之间就形成了一条快速通道。两者之间就直接可以数据互相传送。
浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求，连接建立以后，客户端和服务器端就可以通过 TCP 连接直接交换数据。
当你获取 Web Socket 连接后，你可以通过 send() 方法来向服务器发送数据，并通过 onmessage 事件来接收服务器返回的数据。

WebSocket 实例

目前大部分浏览器支持 WebSocket() 接口，你可以在以下浏览器中尝试实例： Chrome, Mozilla, Opera 和 Safari。

<!DOCTYPE HTML><html>   <head>   <meta charset="utf-8">   <title>webSocket</title>      <script type="text/javascript">         function WebSocketTest()         {            if ("WebSocket" in window)            {               alert("您的浏览器支持 WebSocket!");               // 打开一个 web socket               var ws = new WebSocket("ws://localhost:9998/echo");               ws.onopen = function()               {                  // Web Socket 已连接上，使用 send() 方法发送数据                  ws.send("发送数据");                  alert("数据发送中...");               };               ws.onmessage = function (evt)                {                   var received_msg = evt.data;                  alert("数据已接收...");               };               ws.onerror = function (evt) {                   //出错                   alert(JSON.stringify(evt));                }               ws.onclose = function()               {                   // 关闭 websocket                  alert("连接已关闭...");                };            }            else            {               // 浏览器不支持 WebSocket               alert("您的浏览器不支持 WebSocket!");            }         }      </script>   </head>   <body>      <div id="sse">         <a href="javascript:WebSocketTest()">运行 WebSocket</a>      </div>   </body></html>

WebSocket 事件

以下是 WebSocket 对象的相关事件:

事件事件处理程序描述 open Socket.onopen 连接建立时触发 message Socket.onmessage 客户端接收服务端数据时触发 error Socket.onerror 通信发生错误时触发 close Socket.onclose 连接关闭时触发

WebSocket 方法

以下是 WebSocket 对象的相关方法:

方法描述 Socket.send() 使用连接发送数据 Socket.close() 关闭连接

阅读全文

0 0