chat

//chatserver.java

@ServerEndpoint("/chatserver")
public class Ex03Server {
	
	//현재 서버에 접속한 클라이언트의 WebSocket Session 목록
	private static ArrayList<Session> list = new ArrayList<Session>();

	@OnOpen
	public void handleOpen(Session userSession) {
		
		//클라이언트 연결 요청 + 접속
		System.out.println("클라이언트 접속 성공");
		
		//if (list.size() < 2) {
			list.add(userSession); //접속자 관리
		//} else {
			//userSession.getBasicRemote().sendText("유저가 꽉찼습니다.");
		//}
		
		//System.out.println(list); //덤프
		
		for (Session session : list) {
			//목록내에서 현재 접속한 사람이 아닌 사람 -> 나 빼고 나머지
			if (session != userSession) {
				
				try {
					
					//해당 세션에 연결된 클라이언트에게 메시지를 전달한다.
					session.getBasicRemote().sendText("다른 유저가 접속했습니다.");
					
				} catch (Exception e) {
					System.out.println(e);
				}
				
			}
		}
		
	}
	
	@OnClose
	public void handleClose(Session userSession) {
		
		System.out.println("클라이언트 접속 해제");
		
		//접속을 끊은 유저는 세션 리스트에서 제거
		list.remove(userSession);		
	}

	@OnError
	public void handleError(Throwable t) {
		t.printStackTrace();
	}
	
	@OnMessage
	public String handleMessage(String message, Session userSession) {
		
		//클라이언트 -> 서버 -> 다른 클라이언트
		
		//강아지#안녕하세요.
		int index = message.indexOf("#");
		
		String user = message.substring(0, index);
		String txt = message.substring(index + 1);
		
		for (Session session : list) {
			if (session != userSession) {
				try {
					session.getBasicRemote().sendText(message);
				} catch (Exception e) {
					System.out.println(e);
				}
			}
		}
		
		
		return null;
	}
	
}

 

//chat javascript

<script>
    
		//서버 주소
		const url = "ws://localhost:8090/codestudy/server";
		let ws;
		
		$("#btnConnect").click(function() {
			
			//유저명 확인
			if ($("#user").val().trim().length != 0) {

				//서버와 소켓 연결하기
				ws = new WebSocket(url);
				
				ws.onopen = function(evt) {
					
					//연결 직후 해야 할일
					print($("#user").val(), "연결되었습니다.");
					
					$("#user").attr("disabled", true);
					$("#btnConnect").attr("disabled", true);
					$("#btnDisconnect").attr("disabled", false);
					$("#message").attr("disabled", false);
					$("#message").focus();
					
				};
				
				ws.onclose = function(evt) {
					print($("#user").val(), "종료되었습니다.");
				};
				
				ws.onerror = function(evt) {
					console.log(evt);
				};
				
				ws.onmessage = function(evt) {
					
					//홍길동#안녕하세요.
					var index = evt.data.indexOf("#");
					var user = evt.data.substring(0, index);
					var txt = evt.data.substring(index + 1);
					
					print(user, txt);
					
					$("#output").scrollTop($("#output").prop("scrollHeight"));
					
				};
				
			} else {
				alert("유저명을 입력하세요.");
				$("#user").focus();
			}
			
		});
		
		$("#btnDisconnect").click(function() {
			ws.close();
		});
		
		$("#message").keyup(function() {
			
			//서버에 메시지 보내기
			//강아지#안녕하세요.
			if (event.keyCode == 13) {
				ws.send($("#user").val() + "#" + $("#message").val());
				
				print($("#user").val(), $("#message").val());
				
				$("#message").val("");
				$("#message").focus();
				
				//스크롤바를 가장 밑으로 내려라
				$("#output").scrollTop($("#output").prop("scrollHeight"));
			}
			
		});
		
		$("#user").keydown(function() {
			if (event.keyCode == 13) {
				$("#btnConnect").click();
			}
		});
		
		function print(user, msg) {
			
			let temp = "";
			
			temp += "<div>";
			temp += "[" + user + "] ";
			temp += msg;
			temp += "<span style='font-size:11px; color: #777;'>";
			temp += (new Date()).toLocaleTimeString();
			temp += "</span>";
			temp += "</div>";
			
			$("#output").append(temp);
			
		}
		
	
    </script>