WebSocket的使用

websocket相当于一个连接客户端和服务器端的管道,可以长时间的进行保持,也就是持久化协议,期间不需要进行一次次的建立request和response连接。它和Http协议的不同之处就在于Http协议进行浏览器和服务器进行连接时,Http创建的连接需要频繁地进行创建和关闭,因为Http协议中浏览器和服务器一次request发送和一次response的返回就是一次通信,一次通信结束之后,立即关闭通道,不能持久保持。而恰恰也是websocket的和Http协议的这个区别,才凸显了websocket的强大。假如我们利用ajax轮询(浏览器隔个几秒就发送一次请求,询问服务器是否有新信息)的话,看似持久化,但其实并没有持久化,它是通过浏览器端一直向服务器进行request,浏览器一直进行response回应来实现,采用这种方式这样会浪费很多资源。所以,websocket与之相比既避免了重复做无用功,又实现了数据传输,效率极高!下面就讲一讲怎么来使用websocket。
在这里插入图片描述

websocket中的注解:

1.@ServerEndpoint(): 是一个类层次的注解
作用: 将目前的类定义成一个websocket服务器端。注解的值将被用于监听用户连接的终端访问URL地址,
2.@OnOpen和@OnClose: 是方法层次的注解
作用: 定义当一个新用户连接和断开的时候所调用的方法,一般只有一个参数,javax.websocket.Session可选参数。如果有这个参数,容器将会把当前发送消息客户端的连接Session注入进去。
3.@OnMessage: 是方法层次的注解
作用: 定义了当服务器接收到客户端发送的消息时所调用的方法,可以有两个参数,包含一个javax.websocket.Session可选参数。如果有这个参数,容器将会把当前发送消息客户端的连接Session注入进去。另一个可以是前端需要发送或者广播的数据,下面的例子中会有提到

websocket的使用

第一步:若要使用websocket,首先需要先注册一个websocket通道,可以直接在.js文件中创建通道
退出页面浏览器就会监测到session离开,自动进行关闭

//服务器端
	@OnOpen
	public void open(Session session) {
		String queryString = session.getQueryString();//用getQueryString()方法接收会将穿过来的全部内容接收
		username = queryString.split("=")[1];//分割字符串
		
		this.names.add(username);
		this.sessions.add(session);
		
		String msg = this.username+"进入了聊天室!<br/>";
		pojo.Message message = new pojo.Message();
		message.setUsernames(this.names);
		message.setWelcome(msg);
		
		this.broadcast(sessions,message.toJson());
	}


	
	@OnClose
	public void close(Session session) {
		
		this.names.remove(this.username);//将names中保存的username去掉
		this.sessions.remove(session);//将remove放在广播前的原因是不需要给自己发送离开信息,先去掉,再广播
		
		String msg = "<br/>"+this.username+"离开了聊天室";
		
		pojo.Message message = new pojo.Message();
		message.setUsernames(this.names);
		message.setWelcome(msg);
		
		this.broadcast(sessions,message.toJson());
		
	}

	private void broadcast(List<Session> ss, String msg) {//广播给用户,下面还会用到
		// TODO Auto-generated method stub
		for(Iterator<Session> iterator = ss.iterator();iterator.hasNext();) {
			Session session  = (Session) iterator.next();
			try {
				session.getBasicRemote().sendText(msg);
			} catch (Exception e) {
				// TODO: handle exception
				e.printStackTrace();
			}
		}
	}

	
//浏览器端
var ws;//一个ws就是一个通信管道,设为全局变量,下面还会用到
var target = "ws://localhost:8080/chat/chatSocket;//必须将前面的HTTP协议改为ws协议,否则无法请求
ws = new WebSocket(target);//new对象的同时发送请求,开启socket通道

第二步:进行消息监测,使用ws.onmessage=function(event){ }方法,处理@OnOpen和@OnClose注解的方法

//服务器端
	
	@OnMessage
	public void sendmassage(Session session,String msg) {
		pojo.Message message = new Message();
		message.setSendmassage(username,msg);
		message.setUsernames(this.names);
		
		this.broadcast(this.sessions, message.toJson());
	}

//浏览器端

            
			ws.onmessage=function(event){					//接收到消息的回调方法
				eval("var msg="+event.data+";");    //将接收到的消息转换为json对象
				
				if(undefined!=msg.welcome){
					$("#content").append(msg.welcome+"<br/>");				//将加入用户的欢迎信息加入到content中
				}
				
				
				
				if(undefined!=msg.usernames){                                        //刷新用户列表
					$("#userList").html("");                                                       //刷新之前进行清空
					$(msg.usernames).each(function(){
						$("#userList").append(this+"<br/>");							//将加入用户信息加入到userList中
					});
				}
				
				if(undefined!=msg.sendmassage){
					$("#content").append(msg.sendmassage);
				}
				
			}

第三步:发送消息,进行消息的处理,用ws.send()进行消息的发送,接受者为@OnMessage注解的方法

//服务器端
	
	@OnMessage
	public void sendmassage(Session session,String msg) {
		
		pojo.Message message = new Message();
		message.setSendmassage(username,msg);
		message.setUsernames(this.names);
		
		this.broadcast(this.sessions, message.toJson());
	}
//浏览器端
		function subsend(){          //按钮事件,用于发送消息
			var val = $("#msg").val();
			ws.send(val);               //发送消息
			$("#msg").val("");
		}
©️2020 CSDN 皮肤主题: 书香水墨 设计师: CSDN官方博客 返回首页
实付0元
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

1.余额是钱包充值的虚拟货币,按照1:1的比例进行支付金额的抵扣。
2.余额无法直接购买下载,可以购买VIP、C币套餐、付费专栏及课程。

余额充值