Websocket实战
Websocket实现了浏览器和服务器后台互相通信,和传统的浏览器请求服务器不同的特点是:服务器可以推送消息给浏览器。基于html5的websocket,可以做事件机制。
Html5支持websocket,新版本的主流浏览器(Chrome4+,FireFox4+,IE10+)都支持。服务器jetty8+和tomcat7+支持websocket。
Websocket连接串为:ws://127.0.0.1:8080/ 安全连接前缀tcp为wws。JS使用非常简单,如下:
var ws = new WebSocket("ws://127.0.0.1:8080/");
ws.onmessage = function(e){console.log(e.data)};
ws.send("1");
以上示例简单实现了浏览器连接、接收和发送websocket。第一行建立连接,第二行接收消息打印在控制台,第三行发送消息给服务器。
Java后台实现代码如下:
WSHandler:WebSocketHandler实现类,处理接收和发送响应行为。
import java.io.IOException;
import javax.servlet.http.HttpServletRequest;
import org.eclipse.jetty.websocket.WebSocket;
import org.eclipse.jetty.websocket.WebSocketHandler;
public class WSHandler extends WebSocketHandler
{
@Override
public WebSocket doWebSocketConnect(HttpServletRequest request, String protocol)
{
System.out.println("do connect:" + Thread.currentThread().getName());
return new MyWebSocket();
}
class MyWebSocket implements WebSocket.OnTextMessage
{
Connection connection;
@Override
public void onOpen(Connection connection)
{
System.out.println("open:" + Thread.currentThread().getName());
this.connection = connection;
}
@Override
public void onClose(int closeCode, String message)
{
System.out.println("close:" + Thread.currentThread().getName());
}
@Override
public void onMessage(String data)
{
System.out.println("receieve:" + data);
try
{
connection.sendMessage("hello" + data);
}
catch (IOException e)
{
e.printStackTrace();
}
}
}
}
WebSocketServer:测试类,启动jetty服务,监听端口8080。
import org.eclipse.jetty.server.Server;
public class WebSocketServer
{
private Server server;
private int port;
public static void main(String[] args)
{
WebSocketServer server = new WebSocketServer(8080);
server.start();
}
public WebSocketServer(int port)
{
this.port = port;
}
public void start()
{
server = new Server(port);
WSHandler myWebSocketHandler = new WSHandler();
server.setHandler(myWebSocketHandler);
try
{
server.start();
}
catch (Exception e)
{
e.printStackTrace();
}
}
}
在浏览器调试控制台输入效果如下:
var ws = new WebSocket("ws://127.0.0.1:8085/");
undefined
ws.onmessage = function(e){console.log(e.data)};
(e){console.log(e.data)}
ws.send("1");
undefined
hello1
后台打印如下:
do connect:qtp2426295-10 - /
open:qtp2426295-10 - /
receieve:1