1、websocket
WebSocket 是 HTML5 开始提供的一种在单个 TCP 连接上进行全双工通讯的协议。WebSocket 使得客户端和服务器之间的数据交换变得更加简单,允许服务端主动向客户端推送数据。在 WebSocket API 中,浏览器和服务器只需要完成一次握手,两者之间就直接可以创建持久性的连接,并进行双向数据传输。传统的网站为了实现推送技术,所用的技术都是 Ajax 轮询。
2、SockJS
有一些浏览器中缺少对WebSocket的支持,而SockJS是一个浏览器的JavaScript库,它提供了一个类似于网络的对象,SockJS提供了一个连贯的,跨浏览器的JavaScriptAPI,它在浏览器和Web服务器之间创建了一个低延迟、全双工、跨域通信通道。SockJS的一大好处在于提供了浏览器兼容性。即优先使用原生WebSocket,如果浏览器不支持WebSocket,会自动降为轮询的方式。
3、前端使用websocket
4、前端使用SockJS
function connect() { //连接服务器函数
var socket = new SockJS(" URL "); //URL需要连接的地址
stompClient = Stomp.over(socket);
stompClient.connect({}, function(frame) {
console.log('Connected: ' + frame); //连接服务器成功
//通过stompClient.subscribe订阅/topic/getResponse 目标(destination)发送的消息
//一对多
stompClient.subscribe('/topic/getResponse',function(response){
showResponse(JSON.parse(response.body));
});
});
}
//关闭双通道
function disconnect(){
if(stompClient != null) {
stompClient.disconnect();
}
}
function showResponse(message){
展示返回的信息
}
值得注意的是,只需要在连接服务器注册端点endPoint时,写访问服务器的全路径URL:
new SockJS('http://127.0.0.1:9091/sbjm-cheng/endpointOyzc');
其他监听指定服务器广播的URL不需要写全路径
stompClient.subscribe('/topic/getResponse',function(response){
showResponse(JSON.parse(response.body));
});