<트러블슈팅> DB 연동 시 쿼리문 오류 / html 내 js 실행안됨

1.DB 연동 시 쿼리문 오류

아래와 같은 회원 목록을 불러온 뒤, 오른쪽의 '삭제' 버튼을 클릭하면 삭제가 되어야 하는데 계속 삭제가 안되고 동일한 페이지로 나타났다.

 

처음엔 아래 코드 중 <a> 링크 부분에 의심이 갔다. 그도 그럴 것이 서블릿에서 서블릿으로 다시 전송한다고..? 그러니까 즉, '삭제'를 클릭하면 기존의 html 페이지에 있는 command 태그를 아래와 같이 삭제 메서드인 'delMember'로 값을 바꾸고, 삭제를 클릭한 회원 정보의 'id'를 받아와

for(int i=0;i<list.size();i++) {
			MemberVO memberVO = (MemberVO) list.get(i);
			String id = memberVO.getId();
			String pw = memberVO.getPw();
			String name = memberVO.getName();
			String email = memberVO.getEmail();
			Date joinDate = memberVO.getJoinDate();
			out.print("<tr><td>" + id + "</td><td>" + pw + "</td><td>" + name + "</td><td>" + email + "</td><td>" + joinDate + "</td><td>"
			+ "<a href='/pro06/member3?command=delMember&id=" + id + "'>삭제</a></td></tr>");
		}

아래와 같이 다시 같은 서블릿에서 명령을 받아 delMember(회원 삭제)를 실행하는 식이었기 때문... 이런 흐름을 처음 봐서, 분명 이 과정 내 어느 부분에서 꼬였을거야, 라고 생각하며 코드를 다시 꼼꼼히 살펴보고 흐름을 다시 정리해보고 했는데도 해결이 안되었다.

}else if(command != null && command.equals("delMember")){
			String id = request.getParameter("id");
			dao.delMember(id);
		}

 

그런데 아뿔싸, console을 확인해보는 것을 깜빡했다. 그래서 기능 하나하나를 만들 때마다 시스템 출력 코드를 통해 하나씩 제대로 작동이 되는지 console을 통해 확인하고 가는거였는데... 그런 확인을 위한 코드도 당연히 만들어두지 않았고(...) 위 오류 이후에도 콘솔을 살펴볼 생각을 못했다. 그리고 console엔 다음과 같은 에러에 대한 설명이 찍혀있었다.

 

"prepareStatement:DELETE FROM T_MEMBERWHERE ID=?
java.sql.SQLSyntaxErrorException: ORA-00933: SQL 명령어가 올바르게 종료되지 않았습니다"

 

아, SQL 구문 문제구나. 어제 분명 이 구문을 본 생각이 나는데, 뭐가 잘못된지도 몰랐던거다. 그리고 바로 위의 내가 작성한 SQL 쿼리문을 보니, 무엇이 문제인지 이제야 깨달았다. T_MEMBER와 WHERE의 쿼리문이 붙어버려 인식이 안되고 있었던 것. 어쩐지, 책에는 WHERE 구문 앞에 띄어쓰기가 되어있길래, 오타인가? 하고 넘겼었는데 이래서였구나, 싶었고 다음과 같이 수정해주었다.

//수정 전
String query = "DELETE FROM T_MEMBER" + "WHERE ID=?";

//수정 후
String query = "DELETE FROM T_MEMBER" + " WHERE ID=?";

그제서야 비로소 앞서 본 페이지에서 '삭제'를 클릭했을 때 기능이 제대로 작동했다. 휴... 그동안 띄어쓰기나 오타 1개 때문에도 여러 오류가 발생하는 걸 경험했던터라 이제는 코드를 꼼꼼히 작성하려고 신경을 쓰고, 오류가 났을 때 오타가 없었는지부터 먼저 확인하는데도 이번 오류는 나도 미처 알지 못했던 부분이라 새로웠다(...).

 

 

2. html 내 js 실행안됨

아래 코드는 html 내에 삽입한 js 코드다. js를 그동안은 따로 분리해서 만들어보는 연습만 했지, html 내에 삽입하는 건 아무래도 생소해선지 이게 정말 작동이 되나 싶었다. 물론 이렇게도 많이 쓴다는 걸 알고는 있었지만... 아니나 다를까 회원가입 시 빈칸으로 놔두고 가입하기를 클릭하면 아래 코드에서처럼 alert창이 나타나야하는데 아무것도 작동을 안하고 그냥 다음 페이지로 넘어가버렸다. js가 작동을 아예 안했던 것. 이것도 그래서 무엇이 문제인건지 한참을 찾았다.

<script type="text/javascript">
		function sendMember() {
			var frmMember = document.frmMember;
			var id = frmMember.id.value;
			var pw = frmMember.pw.value;
			var name = frmMember.name.value;
			var email = frmMember.email.value;
		}
		
		if (id.length==0 || id=="") {
			alert("아이디는 필수입니다.");
		}else if (pw.length==0 || pw=="") {
			alert("비밀번호는 필수입니다.");
		}else if (name.length==0 || name=="") {
			alert("이름은 필수입니다.");
		}else if (email.length==0 || email=="") {
			alert("이메일은 필수입니다.");
		}else {
			frmMember.method="post";
			frmMember.action="member3";
			frmMember.submit();
		}
	</script>

 

Stackoverflow에는 별 도움이 안되는 조언만 있었다. html에서 js의 함수를 불러오는 onclick의 'c'를 대문자로 바꾸라는 둥... 이거 고친다고 고쳐질까 싶기는 했지만 시도는 해봤으나 역시 안됐다. 이건 도저히 알 수 없는 부분이라 생각해서 검색부터 해봤던 건데, 나오는게 딱히 없어서 우선 다른 부분부터 먼저 진행했다.

 

그러다 다음 날, 앞의 1번 오류가 해결되고 자신감을 얻어(?) 이 오류도 해결할 수 있지 않을까 해서 다시 살펴봤다. 아, 그랬더니 보였다. 개발자모드의 console에는 계속 아래와 같은 오류 메세지가 나타나고 있었는데

 

"Uncaught ReferenceError: id is not defined"

 

이게 대체 무슨 뜻인지를 또 한참 생각하다 alert의 첫 시작인 id부터 문제가 된다는 건... 결국 alert가 있는 전체 구문이 지금 작동이 안된단 얘긴데, 싶어 보니 아뿔싸. function 구문이 alert 전체를 감싸고 있어야 했는데 중간에 가로를 닫아버리는 바람이 alert 구문과 분리되어있었다. 아, 그래서였구나... alert도 function에 함께 포함되는 기능이었기 때문에 그래서 아래와 같이 수정해주었다.

	<script type="text/javascript">
		function sendMember() {
			var frmMember = document.frmMember;
			var id = frmMember.id.value;
			var pw = frmMember.pw.value;
			var name = frmMember.name.value;
			var email = frmMember.email.value;
		
		if (id.length==0 || id=="") {
			alert("아이디는 필수입니다.");
		}else if (pw.length==0 || pw=="") {
			alert("비밀번호는 필수입니다.");
		}else if (name.length==0 || name=="") {
			alert("이름은 필수입니다.");
		}else if (email.length==0 || email=="") {
			alert("이메일은 필수입니다.");
		}else {
			frmMember.method="post";
			frmMember.action="member3";
			frmMember.submit();
		}
	}
	</script>

그러고나니 이제서야 작동. 이렇게 html 내에 js를 넣어 기능을 구현하는 첫 시도를 드디어 성공하였다. 휴. 다음부터는 이런 형태의 구문에 겁나지는 않을 것 같다.

 

 

위의 두 트러블 모두 어떻게 보면 띄어쓰기나 가로의 위치와 같은 단순하고 작은 것이 원인이 된 것이었지만, 또 알고보면 그만큼 내가 그 부분에 주의를 기울이지 못했고 중요하게 인식이 되지 못하고 있었다는 뜻으로 이해가 되었다. 그래서 빨리 발견하지 못했던 것이고. 그러니 앞으로는 이와 같은 오류에 이만큼의 시간을 쏟지는 않을테니(?), 이렇게 또 배웠다고 생각한다.

 

 

 

 

 

코드 참고 : 도서 <자바 웹을 다루는 기술>