[3강] 동빈나 JSP Ajax 실시간 익명 채팅 사이트 개발하기 (메시지 전송기능 구현하기)

https://youtu.be/Div5-RHVyaY?list=PLRx0vPvlEmdAVcSdYgqjJ64A7ggHhorU_

 

ChatSubmitServlet 을 생성하여 chatName 과 chatContent를 받아 데이터에 Post 하는 코드입니다.

web.xml 에 Servlet 을 등록합니다.

index.jsp 에 해당 javascript 코드를 작성합니다.

전송버튼(onclick=submitFunction())이 눌렸을 때 chatName 과 chatContent 의 현재 값(.val())을 받아와서

ajax Post 로 data를 보냅니다.

데이터가 성공(result == 1)하면 전송성공 알림창을

데이터가 비어있다면(result == 0) 이름과 내용 요청 알림창을

그 외의 경우라면 데이터베이스 오류라는 알림창을 보냅니다.

그 후, 메시지 전송창을 초기화 하기 위해 .val(''); 를 추가합니다.

테스트 메시지를 입력하고 전송하여, 전송알림창과 DB 에 입력이 되는지 확인합니다.

알림창은 이쁘지 않으므로 부트스트랩 알림창을 사용하기 위해 index.jsp 하단에 다음과 같이 추가합니다.

그 후, 자바스크립트 부분에서 autoClosingAlert()라는 함수를 추가한 후, submitFunctio 의 알림창들을 autoClosingAlert()로 변경합니다. 2000 은 2초를 의미합니다.

이렇게 DB에 들어가고 메시지 전송 성공창이 뜬 후, 2초 후에 사라지면 정상작동입니다.

​