WebQQ聊天室

  • 什么是WebSocket

WebQQ聊天室_第1张图片

  • ajax轮询

WebQQ聊天室_第2张图片

  • ajax轮询示例代码

$(function() {

to_page();

        setInterval("isHave();",3000);

});

function isHave(){

$.ajax({

url : "localhost/isHave",

data : {},

datatype: "json",

type : "post",

success : function(result) { console.log(result);

},

}

});

}

  • WebSocket的优点

WebSocket API的优势在于服务器和客户端可以在固定的时间范围内的任意时刻,相互推送消息。在建立连接之后,服务器可以主动传送数据给客户端

WebSocket 并不限于以AJAX(或XHR)方式通信,因为Ajax技术需要客户端发起请求,而WebSocket服务器和客户端可以彼此相互推送信息。

  • WebSocket的使用

1.加入Spring+websocket所依赖的Jar包

WebQQ聊天室_第3张图片

2.注册SebSocket处理器,名为websocket

WebQQ聊天室_第4张图片

3.创建握手拦截器,重写beforeHandshake方法,这个方法负责拦截HttpSess中的数据,放到WebSocket Session 中

WebQQ聊天室_第5张图片

4.处理页面文本消息,从WebSocket session中获取数据,在页面显示,并保存到数据库。

WebQQ聊天室_第6张图片

5.JS页面

WebQQ聊天室_第7张图片

6.运行效果

WebQQ聊天室_第8张图片

  • WebSocket 总结

1.WebSocket协议
    是从HTML5开始提供的、基于TCP的、对传统HTTP协议(短连接)的升级版
    解决的问题:
        1.解决了多次握手的问题(长连接),提高效率
        2.服务器可以推送数据给客户端,不需要客户端轮询等low操作
2.客户端实现方式 
    JavaScript对WebSocket的支持:
    2.1.创建客户端连接的方式:
        websocket = new WebSocket("ws://localhost:9090/websocket");
    2.2.websocket对象常用事件:
        onerror:    连接到服务端错误时触发
        onmessage:    收到服务器推送的消息时触发
        onclose:    连接关闭时触发
        onopen:        连接到服务端成功后触发
3.JDK支持
    自行查资料学习
4.Spring框架封装的WebSocket用法
    4.1.引入spring-websocket.jar
    4.2.代码步骤
        重写握手拦截器(处理Session)
        重写消息处理器
        编写一个配置类:
            向Spring工厂注册一个请求路径和消息处理器
            向Spring工厂注册一个握手拦截器

你可能感兴趣的:(WebQQ聊天室)