websocket的简单应用

websocket的简单应用

在你需要服务器通知的页面加js参考如下

 var websocket = null;
 //定义全局变量
 var receiveEvent = null;
    //判断当前浏览器是否支持WebSocket
    if ('WebSocket' in window) {
        websocket = new WebSocket("ws://"+wsPath+"websocket");
    }
    else {
        alert('当前浏览器 Not support websocket')
    }

    //连接发生错误的回调方法
    websocket.onerror = function () {
        //setMessageInnerHTML("WebSocket连接发生错误");
    };

    //连接成功建立的回调方法
    websocket.onopen = function () {
        //setMessageInnerHTML("WebSocket连接成功");
    }

    //接收到消息的回调方法
    websocket.onmessage = function (event) {
        //setMessageInnerHTML(event.data);
        //window.location.href ="http://www.baidu.com"
        alert(event.data);
        }
    }

    //连接关闭的回调方法
    websocket.onclose = function () {
        //setMessageInnerHTML("WebSocket连接关闭");
    }

    //监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。
    window.onbeforeunload = function () {
        closeWebSocket();
    }

    //将消息显示在网页上
    function setMessageInnerHTML(innerHTML) {
        //document.getElementById('message').innerHTML += innerHTML + '<br/>';
    }

    //关闭WebSocket连接
    function closeWebSocket() {
        websocket.close();
    }

    //发送消息
    /*function send() {
        var message = document.getElementById('text').value;
        websocket.send(message);
    }*/

服务器端代码参考如下

/**
 * @ServerEndpoint 注解是一个类层次的注解，它的功能主要是将目前的类定义成一个websocket服务器端,
 * 注解的值将被用于监听用户连接的终端访问URL地址,客户端可以通过这个URL来连接到WebSocket服务器端
 */
@ServerEndpoint(value="/websocket",configurator = GetHttpSessionConfigurator.class)
public class WebSocket {
    //静态变量，用来记录当前在线连接数。应该把它设计成线程安全的。
    private static int onlineCount = 0;

    //concurrent包的线程安全map，用来存放每个客户端对应的WebSocket对象。若要实现服务端与单一客户端通信的话，可以使用Map来存放，其中Key可以为用户标识
    //全局静态变量
    public static ConcurrentHashMap<String,WebSocket> webSocketMap =new ConcurrentHashMap<String,WebSocket>();

    //与某个客户端的连接会话，需要通过它来给客户端发送数据
    private Session session;

    //httpsession中获取获取当前用户信息
    private HttpSession httpSession;
    /**
     * 连接建立成功调用的方法
     * @param session  可选的参数。session为与某个客户端的连接会话，需要通过它来给客户端发送数据
     */
    @OnOpen
    public void onOpen(Session session,EndpointConfig config){
        this.session = session;
        this.httpSession=(HttpSession) config.getUserProperties().get(HttpSession.class.getName());
        User user = (User) httpSession.getAttribute(Constants.LOGIN_USER);
        webSocketMap.put(user.getWeixinId(), this);     //加入map中
        addOnlineCount();           //在线数加1
        System.out.println("有新连接加入！当前在线人数为" + getOnlineCount());
    }
    /**
     * 连接关闭调用的方法
     */
    @OnClose
    public void onClose(){      webSocketMap.remove((String)this.httpSession.getAttribute(Constants.OPENID));  //根据key删除websocket
        subOnlineCount();           //在线数减1
        System.out.println("有一连接关闭！当前在线人数为" + getOnlineCount());
    }
    /**
     * 收到客户端消息后调用的方法
     * @param message 客户端发送过来的消息
     * @param session 可选的参数
     * @throws IOException 
     */
    @OnMessage
    public void onMessage(String message, Session session) throws IOException {
        System.out.println("来自客户端的消息:" + message);      
        //WebSocket WebSocket= null;      
        this.sendMessage(message);
        //sendMessage(message);
        System.out.println("给客户端发送消息" );
    }
    /**
     * 发生错误时调用
     * @param session
     * @param error
     */
    @OnError
    public void onError(Session session, Throwable error){
        System.out.println("发生错误");
        error.printStackTrace();
    }
    /**
     * 这个方法与上面几个方法不一样。没有用注解，是根据自己需要添加的方法。
     * @param message
     * @throws IOException
     */
    public void sendMessage(String message) throws IOException{
        this.session.getBasicRemote().sendText(message);
        //this.session.getAsyncRemote().sendText(message);
    }
    public static synchronized int getOnlineCount() {
        return onlineCount;
    }
    public static synchronized void addOnlineCount() {
        WebSocket.onlineCount++;
    }
    public static synchronized void subOnlineCount() {
        WebSocket.onlineCount--;
    }
}

WebSocket之获取HttpSession的主要类GetHttpSessionConfigurator.java

public class GetHttpSessionConfigurator extends ServerEndpointConfig.Configurator { 

    @Override  
    public void modifyHandshake(ServerEndpointConfig config,  
            HandshakeRequest request, HandshakeResponse response) {  
        // TODO Auto-generated method stub  
        HttpSession httpSession = (HttpSession) request.getHttpSession();  
        // ActionContext.getContext().getSession()  
        config.getUserProperties().put(HttpSession.class.getName(), httpSession);  
    }  
}

简单API介绍

1.调用WebSocket构造函数，创建一个WebSocket连接，构造函数返回WebSocket对象实例。几乎全部的操作都是围绕这个对象实例来进行的

var ws = new WebSocket("ws://连接的地址，该参数是必需的","列出应用程序支持的协议用于协议协商，可为数组");

假如参数 2传入的是[a, b],WebSocket服务器只理解协议a，不理解协议b，那么在其触发open事件时服务器选择的是a协议

2.WebSocket的四个事件。
WebSocket是纯事件驱动的，遵循异步编程模式。既可以用on<事件名>，也可以用addEventListener()对事件进行监听器的绑定

open 该事件触发时，协议握手已经完成，WebSocket已经准备好发送和接收数据

message 在接受到消息时触发，注意：WebSocket API只输出完整的消息，而不是WebSocket帧

ws.onomessage = function(e) {
    if(typeof e.data === "string"){
        //对文本数据进行的操作
    }else if(e.data instanceof Blob){
        var a = new Blob(e.data);
        //数据操作
    }else if(e.data instanceof ArrayBuffer){
        var b = new Uint8Array(e.data);
        //数据操作
    }else{
        //其他的
    }
}

WebSocket消息可以处理文本消息，也可以处理二进制数据，这种数据作为Blob消息或者ArrayBuffer消息处理

close 连接关闭时触发，该事件有3个属性很有用，可以用于错误处理和恢复：wasClean（布尔值，表示连接是否顺利关闭，如果是对来自服务器的一个close帧的响应则为true）、code和error

error 响应意外故障的时候触发，close事件中的数字代码和原因有时候能告诉你错误的根源所在

3.WebSocket对象的两个方法。 send()用于在客户端和服务器之间建立全双工双向连接之后，进行数据的传输，在数据传输完后使用close()方法终止连接

function sendData(data) {
    if(ws.readyState === WebSocket.OPEN){
        ws.send(data);
        //如果想发送二进制数据
        // var blob = new Blob("blob contents");
        // ws.send(blob);
        // 或者
        // var a = new Uint8Array([8,6,7,5,3,0,9]);
        // ws.send(a.buffer);
    }else{
        //其他操作
    }
}

close()方法接受两个可选参数：code（数字型的状态代码）和reason（一个文本字符串）

ws.close(1000, ‘closing normally’);
具体的代码意义自行查书查表什么的

参考链接：http://www.cnblogs.com/xdp-gacl/p/5193279.html