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’);
具体的代码意义自行查书查表什么的