Websocket的一些信息
HTML5的WebSocketAPI:它可用于客户端、服务器端。
WebSocketAPI是下一代客户端-服务器的异步通信方法。该通信取代了单个的TCP套接字,使用ws或wss协议,可用于任意的客户端和服务器程序。WebSocket目前由W3C进行标准化。WebSocket已经受到Firefox4、Chrome4、Opera10.70以及Safari5等浏览器的支持。
WebSocketAPI最伟大之处在于服务器和客户端可以在给定的时间范围内的任意时刻,相互推送信息。WebSocket并不限于以Ajax(或XHR)方式通信,因为Ajax技术需要客户端发起请求,而WebSocket服务器和客户端可以彼此相互推送信息;XHR受到域的限制,而WebSocket允许跨域通信。
Ajax技术很聪明的一点是没有设计要使用的方式。WebSocket为指定目标创建,用于双向推送消息。
WebSocket简单用法:客户端页面代码html5
<!DOCTYPE html> <html> <head> <title>Testing websockets</title> </head> <body> <div id="messages"></div> <script type="text/javascript"> // 创建一个Socket实例 var socket = new WebSocket('ws://localhost:8080/webSocket/websocket'); // 打开Socket socket.onopen = function(event) { // 发送一个初始化消息 socket.send('I am the client and I\'m listening!'); // 监听Socket的关闭 socket.onclose = function(event) { console.log('Client notified socket has closed', event); }; // 监听消息 socket.onmessage = function(event) { document.getElementById('messages').innerHTML += '<br />' + event.data; }; // 关闭Socket.... //socket.close() }; </script> </body> </html>
server端:需要jdk7.0.40以上tomcat7以上
/** * 访问 http://localhost:8080/webSocket/websocket.html * @author lijian E-mail:[email protected] * @version 创建时间:2015年4月27日 下午5:26:16 * @description */ @ServerEndpoint(value = "/websocket") public class WebSocketTest { /** * 用于接收传入的WebSocket信息 @OnMessage * Session表明两个WebSocket端点对话 连接的另一端 * @param message * @param session * @throws IOException * @throws InterruptedException */ @OnMessage public void onMessage(String message, Session session) throws IOException, InterruptedException { // 打印客户端收到的消息 System.out.println("服务端收到的消息: " + message); //发送第一条消息 session.getBasicRemote().sendText("我的第一条服务器消息"); //每5秒发送一次 int sentMessages = 0; while (sentMessages < 3) { Thread.sleep(5000); session.getBasicRemote().sendText( "我的服务器消息. 数: " + sentMessages); sentMessages++; } // Send a final message to the client session.getBasicRemote().sendText("我的最后一条服务器消息"); } @OnOpen public void onOpen() { System.out.println("连接到客户端"); } @OnClose public void onClose() { System.out.println("连接关闭"); } }
让我们来看看上面的初始化片段。参数为URL,ws表示WebSocket协议。onopen、onclose和onmessage方法把事件连接到Socket实例上。每个方法都提供了一个事件,以表示Socket的状态。
onmessage事件提供了一个data属性,它可以包含消息的Body部分。消息的Body部分必须是一个字符串,可以进行序列化/反序列化操作,以便传递更多的数据。
WebSocket的语法非常简单,使用WebSockets是难以置信的容易……除非客户端不支持WebSocket。IE浏览器目前不支持WebSocket通信。如果你的客户端不支持WebSocket通信,
看下边的方法:
Flash技术——Flash可以提供一个简单的替换。使用Flash最明显的缺点是并非所有客户端都安装了Flash,而且某些客户端,如iPhone/iPad,不支持Flash。
AJAXLong-Polling技术——用AJAX的long-polling来模拟WebSocket在业界已经有一段时间了。它是一个可行的技术,但它不能优化发送的信息。也就是说,它是一个解决方案,但不是最佳的技术方案。
由于目前的IE等浏览器不支持WebSocket,要提供WebSocket的事件处理、返回传输、在服务器端使用一个统一的API,那么该怎么办呢?幸运的是,GuillermoRauch创建了一个Socket.IO技术。
带Socket.IO的WebSocket
Socket.IO是GuillermoRauch创建的WebSocketAPI,GuillermoRauch是LearnBoost公司的首席技术官以及LearnBoost实验室的首席科学家。Socket.IO使用检测功能来判断是否建立WebSocket连接,或者是AJAXlong-polling连接,或Flash等。可快速创建实时的应用程序。Socket.IO还提供了一个NodeJSAPI,它看起来非常像客户端API。
建立客户端Socket.IO
Socket.IO可以从GitHub下载,可以把socket.io.js文件包含到页面中:
// 创建Socket.IO实例,建立连接 var socket= new io.Socket('localhost',{ port: 8080 }); socket.connect(); // 添加一个连接监听器 socket.on('connect',function() { console.log('Client has connected to the server!'); }); // 添加一个连接监听器 socket.on('message',function(data) { console.log('Received a message from the server!',data); }); // 添加一个关闭连接的监听器 socket.on('disconnect',function() { console.log('The client has disconnected!'); }); // 通过Socket发送一条消息到服务器 function sendMessageToServer(message) { socket.send(message); }
Socket.IO简化了WebSocketAPI,统一了返回运输的API。传输包括:
WebSocket
FlashSocket
AJAXlong-polling
AJAXmultipartstreaming
IFrame
JSONPpolling
你还可以设置任意的Socket.IO构造器的第二个选项,选项包括:
port-待连接的端口
transports-一个数组,包含不同的传输类型
transportOptions-传输的参数使用的对象,带附加属性
Socket.IO还提供了由本地WebSocketAPI提供的普通连接、断开连接、消息事件。Socket还提供了封装每个事件类型的方法
实际应用和WebSocket资源
有很多WebSocke的实际应用。WebSocket对于大多数客户机-服务器的异步通信是理想的,在浏览器内聊天是最突出的应用。WebSocket由于其高效率,被大多数公司所使用。
WebSocket资源
Socket.IO站点:http://socket.io/
WebSocket的Wikipedia:http://en.wikipedia.org/wiki/WebSockets
WebSockets.org站点:http://www.websockets.org/
DojoWebSocket站点:http://www.sitepen.com/blog/2010/10/31/dojo-websocket/