WebSocket

来源:互联网 发布:淘宝达人怎么修改昵称 编辑:程序博客网 时间:2024/05/29 10:58

一、概述

HTTP协议是一种无状态协议,服务器端本身不具有识别客户端的能力,必须借助外部机制,比如session和cookie,才能与特定客户端保持对话。

WebSocket的主要作用是,允许服务器端与客户端进行全双工(full-duplex)的通信。举例来说,HTTP协议有点像发电子邮件,发出后必须等待对方回信;WebSocket则是像打电话,服务器端和客户端可以同时向对方发送数据,它们之间存着一条持续打开的数据通道。

WebSocket协议完全可以取代Ajax方法,用来向服务器端发送文本和二进制数据,而且还没有“同域限制”。
WebSocket不使用HTTP协议,而是使用自己的协议。WebSocket与http协议一样都是基于TCP的,属于应用层的协议,所以他们都是可靠的协议。WebSocket在建立握手连接时,数据是通过http协议传输的,但是在建立连接之后,真正的数据传输阶段是不需要http协议参与的。

请求:
[plain] view plain copy
  1. GET / HTTP/1.1  
  2. Connection: Upgrade     //表示浏览器通知服务器,如果可以,就升级到webSocket协议  
  3. Upgrade: websocket      //表示将通信协议从HTTP/1.1转向该项所指定的协议  
  4. Host: example.com  
  5. Origin: null            //验证浏览器域名是否在服务器许可的范围内  
  6. Sec-WebSocket-Key: sN9cRrP/n9NdMgdcy2VJFQ== //握手协议的密钥,是base64编码的16字节随机字符串  
  7. Sec-WebSocket-Version: 13  
响应:
[plain] view plain copy
  1. HTTP/1.1 101 Switching Protocols  
  2. Connection: Upgrade  
  3. Upgrade: websocket  
  4. Sec-WebSocket-Accept: fFBooB7FAkLlXgRSz0BT3v4hq5s=  
  5. Sec-WebSocket-Origin: null  
  6. Sec-WebSocket-Location: ws://example.com/   //表示进行通信的WebSocket网址  
注意:WebSocket协议用ws表示。此外,还有wss协议,表示加密的WebSocket协议,对应HTTPS协议。

二、客户端

1. 建立连接和断开连接、发送数据和接收数据、处理错误。
2. WebSocket实例对象有一个readyState属性,表示目前的状态,可取4个值:
【0:正在连接;1:连接成功;2:正在关闭;3:连接关闭】
3. 客户端建立WebSocket流程:
(0)检测浏览器是否支持WebSocket
(1)握手协议成功以后,readyState就从0变为1,并触发open事件
(2)关闭WebSocket连接,会触发close事件
(3)客户端收到服务器发送的数据,会触发message事件
(4)连接建立后,客户端通过send方法向服务器端发送数据
[javascript] view plain copy
  1. if(window.WebSocket != undefined) {  
  2.     var ws = new WebSocket("ws://localhost:10010");  
  3.     ws.onopen = function(){  
  4.         console.log("Opened!");  
  5.         ws.send("I'm client,call server!!!");  
  6.     };  
  7.     ws.onclose = function(){  
  8.         console.log("over!!!");  
  9.     };  
  10.     ws.onmessage = function(event){  
  11.         console.log(event.data);  
  12.     };  
  13.     ws.onerror = function(error){  
  14.         console.log("Error: "+ err);  
  15.     }  
  16. }  

三、服务器端

使用ws(https://www.npmjs.com/package/ws)模块部署简单的服务器。
[javascript] view plain copy
  1. var WebSocketServer = require('ws').Server;  
  2. var wss = new WebSocketServer({port: 10010});  
  3. wss.on('connection'function(conn) {  
  4.     //console.log(conn);  
  5.     conn.on('message'function(message) {  
  6.         console.log('received: %s', message);  
  7.         conn.send("I'm server,received your infomation!!!");  
  8.     });  
  9. });  
[转载请标明出处:http://blog.csdn.net/ligang2585116]
原创粉丝点击