웹소켓 기반으로 하는 채팅2

 

 

 

코드를 돌리고 난 결과1 .

 

JSON은 브라우저에서만 인식됨!!!!!

{메세지:, 별명:, 상태:}

JSON형 문자열{별명:"말",상태:"채팅"}

JSON형 문자열{메세지:"히힝",별명:"말",상태:"채팅"}

 

 

채팅방 별명 입력 및 연결하기(입장하기)

 

 

1. 웹 소켓으로 연결하기

- 소켓을 연결함으로(웹소켓.onopen) , 브라우저의 데이터 가져오기 및 다시 서버로 보내기(JSON형태)

 

 

채팅 메세지 보내기 및 나타내기

 

2. 메세지 보내기 및 나타내기

 

1) 웹소켓.onmessage : 자바스크립트로, 클라이언트의 메세지 가져오기(불러오기)

2) innerHTML : 요소 내의 html, 마크업 되는 것을 나타내는 요소, 지금 밑에서는, 이미 메세지로 올라온 데이터들을 그대로 출력하는 형태로,

<br> 로 한줄 밑으로, 받은 메세지로 새로운 데이터 출력하기

 

1) 메세지 보내기 : 메세지를 클라이언트로부터 가져와, 웹소켓.send를 통해 서버로 데이터를 보냄(JSON형태)

 

 

** 메세지는: 처음 메세지를 등록하는 곳에서 등록을 하고(단 1회) 그 후부터 계속 메세지를 위처럼 보내면 된다.

 

 

 

 

해당 UI 코드(연결 및 메세지 내보내기 , 퇴장하기)

 

 

 

핸들러에서는, 웹 소켓으로 받아진 내용들을 리스트 형식으로 나타냄

 

1) JSON <==> Java Object로 변환: ObjectMapper로 필요에 따라 객체를 문자형태로 바꿀 수 있다.

여기서는, 세션을 받아들이면서(웹소켓 동작에 대한 세션), 어떤 데이터를 내보낼지를 나타내는 곳이다.

 

WebSocketSession을 통해 1:1 채팅 메세지를 넣을 수 있다.(즉, 클라이언트로 보낼 수 있다(출력이 가능하다))

 

 

2) remove session을 함으로써 , 현재 연결된 세션을 삭제한다.(끊는다)

 

 

세션에 대한 확인!~!

3. 웹 소켓 환경 설정

 

 

웹소켓을 나타내는 환경 설정 부분