html5_websocket

前言

HTML5 WebSocket实现了服务器与浏览器的双向通讯，开销小，实时性高，常用于即时通讯和对信息实时性要求比较高的应用。
下面讲解如利用Tomcat8+WebSocket开发聊天室。
目前Spring已经推出了WebSocket的API，能够兼容各个服务器的实现

后端

　说明

@ServerEndpoint("/echo") 的 annotation 注释端点表示将 WebSocket 服务端运行在 ws://[Server 端 IP 或域名]:[Server 端口]/websockets/echo 的访问端点，客户端浏览器已经可以对 WebSocket 客户端 API 发起 HTTP 长连接了。使用 ServerEndpoint 注释的类必须有一个公共的无参数构造函数，
@onMessage 注解的 Java 方法用于接收传入的 WebSocket 信息，这个信息可以是文本格式，可以是json数据，也可以是二进制格式。
@OnOpen 在这个端点一个新的连接建立时被调用。参数提供了连接的另一端的更多细节。Session 表明两个 WebSocket 端点对话连接的另一端，可以理解为类似 HTTPSession 的概念。
@OnClose 在连接被终止时调用。参数 closeReason 可封装更多细节，如为什么一个 WebSocket 连接关闭。
@Message 注释，MaxMessageSize 属性可以被用来定义消息字节最大限制，在示例程序中，如果超过 6 个字节的信息被接收，就报告错误和连接关闭。

ChatServer.java

import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;
import javax.websocket.OnClose;
import javax.websocket.OnError;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.PathParam;
import javax.websocket.server.ServerEndpoint;

//该注解用来指定一个URI，客户端可以通过这个URI来连接到WebSocket。类似Servlet的注解mapping。无需在web.xml中配置。
@ServerEndpoint("/ws/chat/{nickName}")
public class ChatServer {
　　//静态变量，用来记录当前在线连接数。应该把它设计成线程安全的。
　　private static int onlineCount = 0;
　　//concurrent包的线程安全Set，用来存放每个客户端对应的MyWebSocket对象。若要实现服务端与单一客户端通信的话，可以使用Map来存放，其中Key可以为用户标识
　　private static CopyOnWriteArraySet<ChatServer> webSocketSet = new CopyOnWriteArraySet<ChatServer>();
　　//与某个客户端的连接会话，需要通过它来给客户端发送数据
　　private Session session;
　　private String nickName;
　　/**
　　* 连接建立成功调用的方法
　　* @param session 可选的参数。session为与某个客户端的连接会话，需要通过它来给客户端发送数据
　　*/
　　@OnOpen
　　public void onOpen(Session session, @PathParam(value = "nickName") String nickName){
　　　　this.session = session;
　　　　this.nickName = nickName;
　　　　webSocketSet.add(this); //加入set中
　　　　String message = String.format("System> %s %s", this.nickName, " 加入.");
　　　　broadCast(message);
　　　　addOnlineCount(); //在线数加1
　　　　System.out.println(nickName+"新加入！当前在线人数为" + getOnlineCount());
　　}

　　/**
　　* 连接关闭调用的方法
　　*/
　　@OnClose
　　public void onClose(){
　　　　webSocketSet.remove(this);　　 //从set中删除
　　　　subOnlineCount();　　　　　　 //在线数减1
　　　　String message = String.format("System> %s, %s", this.nickName, " 离开.");
　　　　broadCast(message);
　　　　System.out.println(this.nickName+"离开！当前在线人数为" + getOnlineCount());
　　}

　　/**
　　* 收到客户端消息后调用的方法
　　* @param message 客户端发送过来的消息
　　* @param session 可选的参数
　　*/
　　@OnMessage
　　public void onMessage(String message, Session session, @PathParam(value = "nickName") String nickName) {
　　　　System.out.println(nickName+":" + message);
　　　　broadCast(nickName + ">" + message);
　　}

　　/**
　　* 发生错误时调用
　　* @param session
　　* @param error
　　*/
　　@OnError
　　public void onError(Session session, Throwable throwable) {
　　　　System.out.println("发生错误");
　　　　System.out.println(throwable.getMessage());
　　}

　　/**
　　* 发送或广播信息
　　* @param message
　　*/
　　private void broadCast(String message) {
　　　　//群发消息
　　　　for (ChatServer chat : webSocketSet) {
　　　　try {
　　　　　　synchronized (chat) {
　　　　　　　　chat.session.getBasicRemote().sendText(message);
　　　　　　}
　　　　} catch (IOException e) {
　　　　　　webSocketSet.remove(chat);
　　　　　　try {
　　　　　　　　　　chat.session.close();
　　　　　　　　} catch (IOException e1) {
　　　　　　}
　　　　　　　　broadCast(String.format(" %s %s", chat.nickName, " has bean disconnection."));
　　　　　　}
　　　　}
　　}

　　public static synchronized int getOnlineCount() {
　　　　return onlineCount;
　　}

　　public static synchronized void addOnlineCount() {
　　　　ChatServer.onlineCount++;
　　}

　　public static synchronized void subOnlineCount() {
　　　　ChatServer.onlineCount--;
　　}
}

前端

　　chat.jsp

<%@ page language="java" import="java.util.*" pageEncoding="UTF-8"%>

String path =
request.getContextPath();

String basePath =
request.getScheme() + "://" + request.getServerName() + ":" + request.getServerPort() + path + "/";

String nickName=request.getParameter("nickName");

<!DOCTYPE HTML>

<html>

<head>

<title>My WebSocket</title>

</head>

<body>

Welcome <br />

<button onclick="closeWebSocket()">Close</button>

</body>

var websocket = null;

//判断当前浏览器是否支持WebSocket

if ('WebSocket'in window) {

websocket = new
WebSocket("ws://localhost:8080/webSocket/ws/chat/<%=nickName%>");

} else {

alert('Not support websocket')

}

//连接发生错误的回调方法

websocket.onerror = function() {

setMessageInnerHTML("error");

};

//连接成功建立的回调方法

websocket.onopen = function(event) {

setMessageInnerHTML("open");

}

//接收到消息的回调方法

websocket.onmessage = function() {

setMessageInnerHTML(event.data);

}

//连接关闭的回调方法

websocket.onclose = function() {

setMessageInnerHTML("close");

}

//监听窗口关闭事件，当窗口关闭时，主动去关闭websocket连接，防止连接还没断开就关闭窗口，server端会抛异常。

window.onbeforeunload = function() {

websocket.close();

}

//将消息显示在网页上

function setMessageInnerHTML(innerHTML) {

document.getElementById('message').innerHTML += innerHTML + '<br/>';

}

//关闭连接

function closeWebSocket() {

websocket.close();

}

//发送消息

function send() {

var message =
document.getElementById('text').value;

websocket.send(message);

}

</script>

</html>

访问

http://127.0.0.1:8080/webSocket/chat.jsp?nickName=dengzy

http://127.0.0.1:8080/webSocket/chat.jsp?nickName=dengbw

java的client

　　java_websocket.

import java.net.URI;

import
java.net.URISyntaxException;

import java.util.Scanner;

import
org.java_websocket.client.WebSocketClient;

import
org.java_websocket.drafts.Draft_17;

import
org.java_websocket.handshake.ServerHandshake;

publicclass TestTocatWebSocket
{

publicstaticvoid main(String[] args) throws URISyntaxException
{

String url = "ws://localhost:8080/webSocket/ws/chat/"+ args[0] ;//

WebSocketClient
wc = new WebSocketClient(new URI(url), new Draft_17()) {

@Override

publicvoid
onOpen(ServerHandshake handshakedata) {

System.out.println(handshakedata.getHttpStatusMessage());

}

@Override

publicvoid onMessage(String message) {

System.out.println(message);

}

@Override

publicvoid onError(Exception ex) {

}

@Override

publicvoid onClose(intcode, String reason, booleanremote) {

}

};

wc.connect();

while (true) {

Scanner scanner = new Scanner(System.in);

String message = scanner.nextLine();

if (message.equals("q")) {

wc.close();

break;

}

scanner.close();

wc.send(message);

}

注意

　1.在部署完成之后需要将在tomcat应用目录中的lib目录下的catalina.jar和tomcat-coyote.jar删掉，比如项目的lib目录在D:\workspace\WebSocket\WebRoot\WEB-INF\lib，而部署的应用lib目录是在D:\tools\apache-tomcat-7.0.32\webapps\WebSocket\WEB-INF\lib，删掉部署目录的lib目录中连两个jar就可以了，否则会包Could not initialize class com.ibcio.WebSocketMessageServlet错误。

　2.Tomcat8安装包里有WebSocket的demo

3.html5 才支持WebSocket　

html5_websocket_tomcat8的更多相关文章

随机推荐

【动态规划】【记忆化搜索】CODEVS 3415 最小和 CodeVS原创
f(l,r,i)表示第i段截第l位到第r位时,当前已经得到的价格最小值,可以很显然地发现,这个是没有后效性的,因为对之后截得的段都不造成影响. 注意水彩笔数=1的特判. 递归枚举当前段的r求解(∵l是 ...
python3开发进阶-Django框架的中间件的五种用法和逻辑过程
阅读目录什么是中间件中间件的执行流程中间件的逻辑过程一.什么是中间件? 官方的说法:中间件是一个用来处理Django的请求和响应的框架级别的钩子.它是一个轻量.低级别的插件系统,用于在全局范围 ...
Bootstrap-datetimepicker日期插件简单使用
写在前面: 日期组件有很多,这里简单的记录下bootstrap的一个日期插件datetimepicker,使用方法比较简单,基本上看一些就会了,但是还是记录下. 这个就不过多的说了,简单粗暴上代码 & ...
Scala实战高手****第10课：Scala继承彻底实战和Spark源码鉴赏
isInstanceOf 和 asInstanceOf is用于判断 as用于转换,把父类类型转换成子类类型 getClass 具体找出类型
SpringMVC(流程+第一个Demo)
一.流程图用户发送请求至前端控制器DispatcherServlet DispatcherServlet收到请求调用HandlerMapping处理器映射器. 处理器映射器根据请求url找到具体的处 ...
python之装饰器、生成器、内置函数、JSON
一.装饰器: 装饰器,器在这里的意思是函数,也就是装饰函数.作用是给其他函数添加新功能,它可以不改变原有的函数,原来的函数和原来一模一样,什么都不需要改变,只需要在函数外部加上调用哪个装饰器就可以了, ...
Linux发布Tomcat Web项目
1.打包项目,项目右键–>Export –> WAR file 2.将.war文件放到tomcat下的webapps下.重启tomcat即可. ps afux — 查看进程 ki ...
两道Java面试题!
body { font-family: 微软雅黑; font-size: 14px; line-height: 2; } html, body { color: inherit; background ...
Android2017最新面试题（3-5年经验个人面试经历）
2017最新Android面试题大家好,在跟大家讲述自己的面试经历,以及遇到的面试题前,先说说几句题外话. 接触Android已经3年,在工作中遇到疑难问题总是在网上(csdn大牛博客,stacko ...
mipmap 二
mipmap 之前讲了生成原理这个讲下我对性能的理解 mipmap 对性能的影响包含两方面 minification时,采样多个textel得到1个pixel颜色,如果是mipmap形成相邻两个 ...

html5_websocket_tomcat8

目录

前言

后端

前端

java的client

注意

html5_websocket_tomcat8的更多相关文章

随机推荐

热门专题