当前位置：用WebSocket实现web在线聊天
2019/04/25 09:13 分类： 技术交流 浏览：22
随着现在web项目的日益发展，web在线聊天用的非常多，所以要实现这个功能我们可以用WebSocket来做，现在奉上WebSocket的基本的代码，通过以下代码，大家学习之后就可以运用到你们的项目逻辑中
后台代码
package cn.itsource.websocket;
import javax.sound.midi.Soundbank;
import javax.websocket.*;
import javax.websocket.server.ServerEndpoint;
import java.io.IOException;
import java.util.concurrent.CopyOnWriteArraySet;
/**
* 定义服务器，客户端可以通过url地址来连接服务器
*/
@ServerEndpoint("/server")
public class Server {
/**
* 该类是set的实现类，是线程安全的，专门用来装客户端连接对象
*/
private static CopyOnWriteArraySet<Server> webSocketSet = new CopyOnWriteArraySet<Server>();
//发送数据到客户端需要session对象
private Session session;
@OnOpen
public void onOpen(Session session){
this.session = session;
webSocketSet.add(this);
System.out.println("客户端已经连接");
}
@OnMessage
public void onMessage(String message) throws IOException {
//接收客户端数据再通过服务器端发送
for (Server server : webSocketSet) {
server.session.getBasicRemote().sendText(message);
}
}
@OnClose
public void onClose(){
//当关闭的时候，删除客户端
webSocketSet.remove(this);
System.out.println("连接已经关闭");
}
@OnError
public void onError(Session session,Throwable throwable){
System.out.println("发送错误");
throwable.printStackTrace();
}
}
前台代码
<%-- Created by IntelliJ IDEA. --%>
<%@ page contentType="text/html;charset=UTF-8" language="java" %>
<html>
<head>
<title></title>
</head>
<body>
<div id="content">
</div>
<input type="text" id="message"><input type="button" id="send" value="发送">
<script type="text/javascript">
if ("WebSocket" in window) {
// 通过url地址连接服务器端
var ws = new WebSocket("ws://localhost/server");
document.getElementById("send").onclick = function(){
//获取输入信息
var value = document.getElementById("message").value;
//
ws.send(value);
}
//监听后台传递数据
ws.onmessage = function (evt) {
//获取服务器端返回的数据
var received_msg = evt.data;
//获取div中内容
var html = document.getElementById("content").innerHTML;
//重新给div赋值
document.getElementById("content").innerHTML = html+"<br/>"+received_msg;
};
}else {
// 浏览器不支持 WebSocket
alert("您的浏览器不支持 WebSocket!");
}
</script>
</body>
</html>
赞 0
