본문 바로가기

동빈나 익명 채팅사이트 개발(끝)

[4강] 동빈나 JSP Ajax 실시간 익명 채팅 사이트 개발하기 (등록된 메시지 목록 출력하기)

https://youtu.be/4tJpN6B3HJ0?list=PLRx0vPvlEmdAVcSdYgqjJ64A7ggHhorU_

 

ChatListServlet 을 만들고 web.xml에 추가합니다.

ChatListServlet 에 다음과 같이 추가합니다. doPost 메소드로 listType 객체를 생성하여 today 와 같은 날들을 getToday() 메소드로 getChatName(), getChatContent(), getChatTime() 을 제이슨 형식으로 가져와 출력하는 것입니다.

36, 37 라인에서 value 앞에 있는 '['는 삭제하셔야 합니다.

charset= 으로 수정하셔야 합니다.

index.html 에서 div 가 row 인 곳들을 지워줍니다. 이 부분을 Ajax 로 동적처리 할 것입니다.

그 후 이것을 감싸던 div 에 id='chatList"를 추가합니다.

chatListFunction(type) 과 이 함수 안에서 작동할 addChat() 함수를 작성합니다.

chatListFunction은 post 방식으로 listType data를 보내며,

addChat 함수를 이용해서 chatName, chatContent, chatTime 을 받아옵니다.

스크린샷에는 chatLisfFunction 에 파라미터가 없는데 type을 넣으셔야 합니다.

새로 작성한 javascript가 작동하는지 확인하기 위해 index.html 가장 하단 부분에 button을 추가합니다.

onclick="chatListFunction('today')

추가 버튼을 눌렀을 때, 오늘 날짜로 데이터를 출력하는지 테스트 합니다.

오류잡느라 30분을 날렸네요.. 다 저의 오타였습니다.(물론 동빈나님 오타도 있구요 ^^)