서블릿의 기초 8 - 쿼리스트링으로 값 받아오기 및 유효성 체크하기

다음으로 쿼리 스트링에 대해서 학습해보겠다. 수업 시간에도 배웠던 개념이지만 책으로 학습하면 더 많은 것들을 배울 수 있다.

지금까지 클라이언트에서 서블릿 클래스에 요청하는 방식에 대해서 살펴보았다. 사용자가 입력한 데이터가 서버로 보내져그 값으로 여러가지 로직을 구현할 수 있었다면 이제 서블릿 클래스에서 사용자가 입력한 값을 얻어오는 방법을 학습해볼 것이다.

---

 

 

 

쿼리 스트링이란?

서버에서 클라이언트가 보낸 데이터를 얻어오기 위해서는 쿼리 스트링이란 기술을 사용해야 한다. 사용자가 입력한 데이터를 서버로 전달하는 가장 단순한 방법으로 널리 사용된다. 이 방법은 get 방식으로 요청했을 때 URL 주소 뒤에 입력 데이터를 함께 제공하는 방법으로 "리소스?이름=값"의 형식을 취한다.

웹 프로그래밍에서는 데이터가 쿼리 스트링 형태로 서버로 전송되고 이렇게 전송된 데이터를 얻어오기 위해서 쿼리 스트링에서 언급한 이름을 알아야 데이터를 얻어올 수 있기 때문이다.

 

더 나아가서 웹 프로그래밍을 하다 보면 쿼리 스트링 형태로 개발자가 직접 데이터를 넘겨주어야 할 경우가 있다. 그럼 왜 데이터를 쿼리 스트링으로 전송하는 걸까?

웹 프로그램에서는 현재 페이지의 정보를 바로 다음 페이지에서 젼혀 알 수 없다. 페이지가 이동되면 이전 페이지의 값들은 모두 잃게 된다. 하지만 프로그램을 만들다 보면 페이지 사이에 정보 교환이 필요한 경우가 있는데 이를 위해서 웹 프로그래밍에서  제공하는 것이 쿼리 스트링이다.

쿼리 스트링은 브라우저 URL의 주소 입력란에서 확인할 수 있다.

 

 

위 문장은 5개의 쿼리 스트링으로 구성된 것임을 알 수 있다. 쿼리 스트링의 URL 인코딩 규칙은 영문자 대소문자와 숫자는 그대로 전달되며 변환되지 않지만 공백은 +로 변환되어 전달되고, 한글은 % 기호와 함께 16진수로 변환되어 전달된다. 여러 개의 name=value들은 & 기호로 구분된다.

쿼리 스트링 형태로 데이터가 전송되는 것은 <form> 태그에 전송방식을 get으로 하여 서버에 데이터를 보낼 때 살펴볼 수 있이다. 서버로 데이터를 전송하기 위해서는 데이터를 입력할  수 있는 텍스트 박스가 필요하다.

 

브라우저 주소 입력란을 살펴보면 사용자가 입력한 값이 쿼리 스트링인 "이름=값" 형태로 서버 페이지에 전달되는 것을 확인할 수 있다.

---

 

 

 

 

요청 객체(request)와 파라미터 관련 메소드(getParameter)

사용자가 폼에 입력한 값을 서블릿에서 어떻게 얻어오는지 살펴보기로 하자. request 객체의 getParameter() 메소드를 호출하여 <input> 태그를 통해 입력된 값을 읽어올 수 있다. 원하는 값을 얻기 위해서는 입력 양식의 name 속성값을 getParameter()의 매개변수로 기술한다.

 

 

getParameter()는 파라미터 값을 항상 문자열 형태로만 얻어온다. 나이는 int형 변수에 저장하기 때문에 입력 받아온 문자열 형태의 값을 int형으로 변환해야 한다. 이때 Integer 클래스의 ParseInt() 메소드가 사용된다.

---

 

 

 

 

 

텍스트 박스에 입력된 값 얻어오기

 

 

 

 

 

 

JSP에서 아이디와 나이를 입력했기 때문에 이 웹페이지가 잘 실행되는 것이다. 근데 다시를 눌러도 이전으로 돌아가지는 않았다.

---

 

 

 

 

 

자바스크립트 폼에 입력된 정보가 올바른지 판단하기

데이터를 서버로 보내기 전에 입력된 데이터가 유효한지(올바른지) 판단하여 유효하지 않으면 사용자가 다시 데이터를 입력하도록 유도해야 한다. 예를 들면 다음과 같은 사례이다. 나이에 숫자를 입력하지 않으니 이렇게 오류가 떴다.

 

 

 

 

아무것도 입력하지 않아도 이렇게 오류가 뜬다. 이러한 예외처리를 자바스크립트로 처리할 수 있다고 한다.

 

 

여러 HTML 문서에 사용된 자바스크립트의 내용이 반복적일 경우에는 HTML 파일마다 같은 내용을 반복적으로 기술하기 보다 자바스크립트 부분만을 독립된 파일로 구성한다. 그런 다음 이 파일을 HTML 문서에 간단히 삽입하여 그 내용들을 재사용하는 방법을 취한다.

자바스크립트 부문만을 독립된 파일로 작성하려만 파일의 확장자가 반드시 "js"여야 한다. 또한 js 확장자를 붙인 파일은 순수하게 자바스크립트로만 구성되어야 한다. 자바 스크립트 파일을 HTML 문서에 삽입하려면 <script> 태그의 src 속성에 해당 자바스크립트 파일을 지정한다.

 

---

 

 

 

 

유효성 체크하기

자바스크립트 파일을 만들고 다음과 같이 코드를 작성했다.

 

 

자바스크립트를 받을 수 있도록 HTML 파일을 수정해주었다. 그리고 웹페이지서 다음과 같은 내용을 입력한 후 자바스크립트로 확인했다. 오랜만에 자바스크립트를 실행해보니 좀 많이 헤깔리기는 했다.

 

 

 

 

 

나이에 숫자를 쓰지 않고 한글을 썼더니 오류 메시지가 뜨면서 이와 같은 코드를 볼 수 있었다.

---

 

 

 

학습을 마치고

오늘 이렇게 서블릿 공부를 조금씩  해보고 있다. 하기 싫은 공부를 할 때는 좋아하는 영상을 시청하며 하는 게 많은 도움이 된다. 난 아마도 영상을 끊지는 못할 것 같다. 가장 좋아하는 것이 영상이니 이걸 직업으로 삼으면 되는 것이다. 

저녁을 먹지 않았다가 배가 많이 고파서 과자 생각이 났다. 이럴 바에는 과일로 요기를 하는 게 좋을 것 같아 조금 전에 키위와 사과를 먹었다. 그리고 오늘 운동도 다녀왔는데 정말 좋았다.

이제 하고 싶지 않아도 매일 하게 되는 습관이 적어도 세 가지 이상은 생긴 것 같다. 그중에 하나는 개발 공부를 하는 것과 학습 일지를 쓰는 것이다.