260일차(모험 169일차) - 상대방과 나 구분하기

처음에 웹 소켓 재 연결 관련해서 계속 찾아보다가 답이 안나올 것 같아서

다른걸 먼저 하기로 했다. 상대방과 구분하는 코드를 작성했는데

이 코드를 활용해서 front에서 어떻게 띄울지 고민해야겠다.

 

 

서버에서 상대방과 나를 구분하는 코드를 작성

출처 : WebSocket으로 실시간 채팅 구현하기.(springboot)

 

메세지를 보낸 사람의 SessionId와 SessionList의 Id가 같지 않으면 상대방이 보낸 메시지,

아이디가 같다면 내가 보낸 메시지

코드 보기 : [add] 상대방과 나 채팅 구분하기 [#37] #58

 

---

 

상대방과 나의 채팅 칸 색을 다르게 해서 띄우고 싶었다.

그런데 ooo가 입장했다는 알림과 메세지를 보낼 때 글이 같은 className으로 되어서

style을 적용하면 채팅 박스가 같은 색상으로 보이게 되므로 이를 구분하여 className을 지정하기로 했다.

 

특정 문자가 포함 되면 (ooo가 입장했다. 에서 입장했다 라는 단어가 포함되면) 

className을 xxx로, 아닌 경우 ooo로 지정하기로 했다.

 

특정 문자열 포함 여부 확인 

특정문자열 확인할 변수.includes("검색하고자 하는 문자열", 검색시작위치)

  *검색 시작위치 생략하면 0으로 설정된다

출처 : [JavaScript] 문자열에서 특정 문자열 포함 여부 확인

if (e.data.includes("님이 입장하셨습니다.")) {}

위 조건에 해당하면 해당 스타일을 회색 배경으로 변경시켰다.

 

 

[add] 입장 알림 회색 박스로 띄우기 [#43] #60