Java Websocket实例【项目实战系列】

最新推荐文章于 2024-06-27 07:00:00 发布

清墨无痕

最新推荐文章于 2024-06-27 07:00:00 发布

阅读量2w

点赞数 15

分类专栏： JAVA 文章标签： Java json websocket 实例 spring

本文链接：https://blog.csdn.net/lovelong8808/article/details/52212566

版权

JAVA 专栏收录该内容

41 篇文章 1 订阅

订阅专栏

现很多网站为了实现即时通讯，所用的技术都是轮询(polling)。轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发

出HTTP request，然后由服务器返回最新的数据给客服端的浏览器。这种传统的HTTP request 的模式带来很明显的缺点 – 浏

览器需要不断的向服务器发出请求，然而HTTP request 的header是非常长的，里面包含的数据可能只是一个很小的值，这样会占

用很多的带宽。WebSocket提供了一个受欢迎的技术，以替代我们过去几年一直在用的Ajax技术。

一、什么是WebSocket API?

WebSocket API是下一代客户端-服务器的异步通信方法。该通信取代了单个的TCP套接字，使用ws或wss协议，可用于任意的

客户端和服务器程序。WebSocket目前由W3C进行标准化。WebSocket已经受到Firefox 4、Chrome 4、Opera 10.70以及Safari 5等

浏览器的支持。

WebSocket API最伟大之处在于服务器和客户端可以在给定的时间范围内的任意时刻，相互推送信息。WebSocket并不限于以

Ajax(或XHR)方式通信，因为Ajax技术需要客户端发起请求，而WebSocket服务器和客户端可以彼此相互推送信息；XHR受到域

的限制，而WebSocket允许跨域通信。

Ajax技术很聪明的一点是没有设计要使用的方式。WebSocket为指定目标创建，用于双向推送消息。

那么我就开始我在项目中对websocket的使用，首先使用的是J2EE7的架包。

架包加完之后，只需要再添加2个类就可以实现使用的功能了。

首先添加一个Java类，WebsocketController.java

package com.lwl.activemq.controller.websocket;

import java.util.Map;
import java.util.concurrent.ConcurrentHashMap;

import javax.websocket.*;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;


import org.slf4j.Logger;
import org.slf4j.LoggerFactory;
/**
 * 功能说明：websocket处理类, 使用J2EE7的标准
 * @author Administrator
 * @create 2016-8-11 下午4:08:35
 * @version 1.0
 */
@ServerEndpoint("/websocket/{myWebsocket}")
public class WebsocketController {
	private static final Logger logger = LoggerFactory.getLogger(WebsocketController.class);

    public static Map<String, Session> clients = new ConcurrentHashMap<String, Session>();

    /**
     * 打开连接时触发
     * @param myWebsocket
     * @param session
     */
    @OnOpen
    public void onOpen(@PathParam("myWebsocket") String myWebsocket, Session session){
        logger.info("Websocket Start Connecting:" + myWebsocket);
        System.out.println("进入："+myWebsocket);
        clients.put(myWebsocket, session);
    }

    /**
     * 收到客户端消息时触发
     * @param myWebsocket
     * @param message
     * @return
     */
    @OnMessage
    public String onMessage(@PathParam("myWebsocket") String myWebsocket, String message) {
        return "Got your message ("+ message +").Thanks !";
    }

    /**
     * 异常时触发
     * @param myWebsocket
     * @param throwable
     */
    @OnError
    public void onError(@PathParam("myWebsocket") String myWebsocket, Throwable throwable) {
        logger.info("Websocket Connection Exception:" + myWebsocket);
        logger.info(throwable.getMessage(), throwable);
        clients.remove(myWebsocket);
    }

    /**
     * 关闭连接时触发
     * @param myWebsocket
     */
    @OnClose
    public void onClose(@PathParam("myWebsocket") String myWebsocket) {
        logger.info("Websocket Close Connection:" + myWebsocket);
        clients.remove(myWebsocket);
    }


    /**
     * 将数据传回客户端
     * 异步的方式
     * @param myWebsocket
     * @param message
     */
    public static void broadcast(String myWebsocket, String message) {
        if (clients.containsKey(myWebsocket)) {
            clients.get(myWebsocket).getAsyncRemote().sendText(message);
        } else {
            throw new NullPointerException("[" + myWebsocket +"]Connection does not exist");
        }
    }

}

然后添加相应的接受页面index.html：

<!DOCTYPE HTML PUBLIC "-//W3C//DTD HTML 4.01 Transitional//EN" "http://www.w3.org/TR/html4/loose.dtd">
<html>
    <head>
        <meta http-equiv="Content-Type" content="text/html; charset=UTF-8">
        <meta http-equiv="X-UA-Compatible" content="IE=edge">
        <meta name="viewport" content="width=device-width, initial-scale=1">
          <script type="text/javascript" src="resources/jquery-1.8.3.min.js"></script>
     </head>   
<body>

 
<script type="text/javascript">
 //测试controller是否可以进入
// ajaxDo("/activemq-client/index",null);
 
// function ajaxDo(url,data){
// 	 $.ajax({
// 	        url:url ,
// 	        type: "post",
// 	        dataType: "json",
// 	        data: data,
// 	        success:function(result){
// 	           if(result.success){
// 	        	   alert(result.data);
// 	           }else{
// 	        	   alert(result.msg);
// 	           }
// 	        }
// 	    });
// }	


//--------------------------------- webSocket ----------------------------------------------
  initSocket("user");
  initSocket("news");
  initSocket("client");
  

function initSocket(myWebsocket) {
	
	var webSocket = null;
	
    window.onbeforeunload = function () {
        //离开页面时的其他操作
    };

    if (!window.WebSocket) {
        console("您的浏览器不支持websocket！");
        return false;
    }

    var target = 'ws://' + window.location.host + "/activemq-client/websocket/"+myWebsocket;  
		  
		if ('WebSocket' in window) {  
			webSocket = new WebSocket(target);  
		} else if ('MozWebSocket' in window) {  
			webSocket = new MozWebSocket(target);  
		} else {  
		    alert('WebSocket is not supported by this browser.');  
		    return;  
		}  
    
    
    // 收到服务端消息
    webSocket.onmessage = function (msg) {
            alert(msg.data);
        // 关闭连接
        webSocket.onclose();
        console.log(msg);
    };

    // 异常
    webSocket.onerror = function (event) {
        console.log(event);
    };

    // 建立连接
    webSocket.onopen = function (event) {
        console.log(event);
    };

    // 断线
    webSocket.onclose = function () {
		
        console.log("websocket断开连接");
    };
}


</script>

</body>
</html>

好了，websocket已经实现了，现在最重要的是我们要在哪儿监听哪些变动，在推送给前端的问题了，这里我监听了MQ消息队

列中的某个Queen，如果获取到消息就推送给前端展示，稍后我会把MQ的消息队列也写给大家看，做个参考。（当然你也可以

监听属于你自己的对象，主要是调用 WebsocketController.broadcast("client", jsonStr);第一个参数和前端的参数一

致，第二个参数是你想推送给前端的内容）。

<span style="font-size:14px;"><span style="font-family:宋体;">package com.lwl.activemq.listener;

import javax.jms.JMSException;
import javax.jms.Message;
import javax.jms.MessageListener;
import javax.jms.TextMessage;

import org.apache.log4j.Logger;
import org.springframework.stereotype.Component;

import com.alibaba.fastjson.JSON;
import com.lwl.activemq.domain.Client;
import com.lwl.activemq.controller.websocket.WebsocketController;

@Component("clientPushListener")
public class ClientPushListener implements MessageListener {
	 protected static final Logger logger = Logger.getLogger(ClientPushListener.class);
	@Override
	public void onMessage(Message message) {
		 logger.info("[ClientPushListener.onMessage]:begin onMessage.");
	        TextMessage textMessage = (TextMessage) message;
	        try {
	            String jsonStr = textMessage.getText();
	            logger.info("[ClientPushListener.onMessage]:receive message is,"+ jsonStr);
	            if (jsonStr != null) {
	            	Client info = JSON.parseObject(jsonStr, Client.class);
	                System.out.println("==============================接受到的客户信息 开始====================================");
	                System.out.println(info.toString());
	                System.out.println("==============================接受到的客户信息 结束====================================");
	                WebsocketController.broadcast("client", jsonStr);
	            }
	        } catch (JMSException e) {
	            logger.error("[ClientPushListener.onMessage]:receive message occured an exception",e);
	        }
	        logger.info("[ClientPushListener.onMessage]:end onMessage.");
	    }
}</span></span>

清墨无痕

关注

15
点赞
踩
43

收藏

觉得还不错? 一键收藏
14
评论
Java Websocket实例【项目实战系列】

现很多网站为了实现即时通讯，所用的技术都是轮询(polling)。轮询是在特定的的时间间隔（如每1秒），由浏览器对服务器发出HTTP request，然后由服务器返回最新的数据给客服端的浏览器。这种传统的HTTP request 的模式带来很明显的缺点 – 浏览器需要不断的向服务器发出请求，然而HTTP request 的header是非常长的，里面包含的数据可能只是一个很小的值，这样会占
复制链接

扫一扫

专栏目录