浅谈WebSocket技术浅谈WebSocket技术

WebSocket是H5新增的一个通讯协议，这个协议使得客户端与服务器之间的数据交互更为简单，并允许服务器主动向客户端发送数据。
在 WebSocket API 中，浏览器和服务器只需要完成一次握手，两者之间就直接可以创建持久性的连接，并进行双向数据传输。
现在大家大多数都在用ajax技术进行数据交互，但用ajax技术浏览器每获取一次数据就需要发送http请求向服务器获取数据，这种传统的模式下，显然有很多缺点，比如说浏览器发送的http请求可能包含较长的请求头，而真正有效的数据可能是只有一小部分，所以就大大浪费了带宽资源。
浏览器通过 JavaScript 向服务器发出建立 WebSocket 连接的请求后，客户端和服务器端就可以通过 TCP 连接直接交换数据，我想这也是很多人都乐意看到的。
下面是创建 WebSocket 对象，第一个参数 url, 指定连接的 URL。第二个参数 protocol 是可选的，指定了可接受的子协议

var Socket = new WebSocket(url, [protocol] );

如果使用了以上代码创建了 Socket 对象，会看到readyState 这个只读属性，表示当前连接状态：
0 - 表示连接尚未建立。
1 - 表示连接已建立，可以进行通信。
2 - 表示连接正在进行关闭。
3 - 表示连接已经关闭或者连接不能打开。
下面来看看WebSocket 的事件：

open连接建立时触发 message客户端接收服务端数据时触发 error通信发生错误时触发 close连接关闭时触发

而使用连接发送数据，就需要调用Socket.send()方法来发送数据，关闭连接则是Socket.close()
为了让客户端和服务器两者之间建立联系，客户端首先向服务器发起一个http请求，这个请求并非普通http请求，里面包含一些附加头信息，其中"Upgrade: WebSocket"表示这是一个申请协议升级的 HTTP 请求，这样两者之间就建立连接，如果不是人为主动断开，则一直会进行连接。
【浅谈WebSocket技术】测试一下你的浏览器支持不支持WebSocket，如：

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.onclose = function() { // 关闭 websocket alert("连接已关闭..."); }; }else { // 浏览器不支持 WebSocket alert("您的浏览器不支持 WebSocket!"); } }