Tomcat9.0在javaee项目中使用WebSocket

1.在src目录下新建ChatEntpoint.java类

import java.io.IOException;
import java.util.Set;
import java.util.concurrent.CopyOnWriteArraySet;
import java.util.concurrent.atomic.AtomicInteger;

import javax.websocket.OnClose;
import javax.websocket.OnError;
import javax.websocket.OnMessage;
import javax.websocket.OnOpen;
import javax.websocket.Session;
import javax.websocket.server.ServerEndpoint;

@ServerEndpoint(value = "/websocket/chat")
public class ChatEntpoint {
    private static final String GUEST_PREFIX="访客";
    private static final AtomicInteger connectionIds = new AtomicInteger(0);
    //定义一个集合,用于保存所有接入的WebSocket客户端
    private static final Set<ChatEntpoint> clientSet = new CopyOnWriteArraySet<>();
    //定义一个成员变量,记录WebSocket客户端的聊天昵称
    private final String nickname;
    //定义一个成员变量,记录与WebSocket之间的会话
    private Session session;
    public ChatEntpoint() {
        nickname=GUEST_PREFIX+connectionIds.getAndIncrement();
    }

    //当客户端连接进来时自动激发该方法
    @OnOpen
    public void start(Session session) {
        this.session = session;
        //将WebSocket客户端会话添加到集合中
        clientSet.add(this);
        String message = String.format("【%s %s】", nickname,"加入了!");
        //发送消息
        broadcast(message);
    }

    //当客户端断开连接时自动激发该方法
    @OnClose
    public void end() {
        clientSet.remove(this);
        String message = String.format("【%s %s】", nickname,"离开了!");
        //发送消息
        broadcast(message);
    }

    //当收到客户端消息时自动激发该方法
    @OnMessage
    public void incoming(String message) {
        String filterMessage = String.format("【%s %s】", nickname,filter(message));
        broadcast(filterMessage);
    }

    //当客户端通信发生错误时
    @OnError
    public void onError(Throwable t)throws Throwable {
        System.out.println("WebSocket服务器端报错"+t);
    }

    //实现广播消息的工具方法
    public static void broadcast(String msg) {
        //遍历服务器关联的所有客户端
        for(ChatEntpoint client:clientSet) {
            try {
                synchronized(client) {
                    //发送消息
                    client.session.getBasicRemote().sendText(msg);
                }
            }catch(IOException e) {
                System.out.println("聊天错误,向客户端 "+client+" 发送消息出现错误");
                clientSet.remove(client);
                try {
                    client.session.close();
                }catch(IOException el) {}
                    String message = String.format("【%s %s】", client.nickname,"已经断开了连接!");

            }
        }
    }

    //定义一个工具方法,用于对字符串中的HTML字符标签进行转义
    private static String filter(String message) {
        if(null == message) {
            return null;
        }
        char content[] = new char[message.length()];
        message.getChars(0, message.length(), content, 0);
        StringBuilder result = new StringBuilder(content.length+50);
        for(int i=0;i<content.length;i++) {
            //控制对尖括号等特殊字符进行转义
            switch(content[i]) {
            case '<':
                result.append("&lt");
                break;
            case '>':
                result.append("&gt");
                break;
            case '&':
                result.append("&amp");
                break;
            case '"':
                result.append("&quot");
                break;
            default:
                result.append(content[i]);
                break;
            }
        }
        return (result.toString());
    }
}

2.在webContent下新建chat.html文件

<!DOCTYPE html>
<html>
<head>
<meta http-equiv="Content-Type" content="text/html; charset=utf-8">
<title>Insert title here</title>
<script type="text/javascript">
//CazyIt要改成你自己当前的项目名
var url = "ws://"+document.location.host+"/CazyIt/websocket/chat"; 
//创建WebSocket对象
var webSocket = new WebSocket(url);
var sendMsg = function(){
    console.log("11111111111111");
    var inputElement = document.getElementById('msg');
    //发送消息
    webSocket.send(inputElement.value);
    //清空单行文本框
    inputElement.value="";
}
var send = function(event){
    if(event.keyCode==13){
        sendMsg();
    }
};
webSocket.onopen=function(){
    console.log("22222222222222");
    //为onmessage事件绑定监听器,接收消息
    webSocket.onmessage = function(event){
        console.log("33333333333333");
        var show = document.getElementById('show');
        //接收并显示消息
        show.innerHTML +=event.data+"<br/>";
        show.scrollTop = show.scrollHeight;
    }
    document.getElementById('msg').onkeydown = send;
    document.getElementById('sendBn').onclick = sendMsg;
};
webSocket.onclose = function(){
    console.log("4444444444444444444");
    document.getElementById('msg').onkeydown = null;
    document.getElementById('sendBn').onclick = null;
    console.log('WebSocket已经被关闭。');
};
</script>
</head>
<body>
<div style="width:600px;height:240px;overflow-y:auto;border:1px solid #333;" id="show"></div>
<input type="text" size="80" id="msg" name="msg" placeholder="输入内容"/>
<input type="button" value="发送" id="sendBn" name="sendBn"/>
</body>
</html>

备注:文章来自《轻量级javaEE企业应用实战》书中示例

  • 1
    点赞
  • 4
    收藏
    觉得还不错? 一键收藏
  • 0
    评论
评论
添加红包

请填写红包祝福语或标题

红包个数最小为10个

红包金额最低5元

当前余额3.43前往充值 >
需支付:10.00
成就一亿技术人!
领取后你会自动成为博主和红包主的粉丝 规则
hope_wisdom
发出的红包
实付
使用余额支付
点击重新获取
扫码支付
钱包余额 0

抵扣说明:

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

余额充值