본문 바로가기

프로그래밍 언어/Javascript

javascript와 servlet간의 json 송 수신

- javascript(웹 브라우저단)에서 보낼 데이터를 json타입으로 만들어 서버로 보낸다.


1.

등록 버튼(id=registerBtn)을 클릭했을 때 사용자로부터 입력받은 입력 폼 태그의 값들(맛집 이름(id=sname), 위도(id=lat), 경도(id=lng), 메뉴(id=menu)을 받아온다.


2. 

객체를 하나 만들고, 받아온 value값들을 이 객체의 property로 추가해준다. 


3. 

이후 JSON.stringify() 메소드의 매개변수로 넘겨줘서 json 타입의 문자열로 바꿔준다. 

그러면 다음과 같이 {sname : 홍콩반점, lat : 37.12313, lng : 127.123123, menu : 짜장면} 의 형태로 바뀐다.


4.

 이때 HTTP 프로토콜에서의 키:값은 get이면 url, post이면 request의 header에 '키=값' 의 형태로 보내진다. 따라서 키를 만들고, json 형태의 문자열로 만들어진 것을 값으로 갖는 객체 리터럴을 한번 더 만든 데이터를 서블릿으로 요청할 때 보낸다. 그러면 서블릿(JAVA)에서는 request.getParameter(키)의 반환값으로 3번에서 만든 json 형태의 문자열을 얻어 올 수있게 된다.

--javascript에서 json형태의 데이터를 servlet으로 보내기 끝. 이제 서블릿에서 이 값을 읽어와야 한다.



- 웹브라우저(javascript)로부터 받아온 json타입을 servlet(웹 서버단)에서 파싱하여 넘어온 키 값을 읽어오기.


1. 

웹브라우저로부터 post방식으로 온 JSON형태의 문자열을 파싱하는 방법.

아래 코드는 JSON형태의 문자열을 이용하여 JSON 객체를 만들고, 이 객체를 이용하여 받아온 키:값 쌍에서 값들을 파싱해낸다. 

그리고 이 값들로 VO 객체를 만들고 클라이언트로의 요청인 'DB로의 새로운 데이터 등록요청' 을 dao에 요청하는 내용이다. 

설명을 덧붙이자면, 

Javascript(웹 브라우저) 에서는 Servlet 에서 getparameter() 메소드로 JSON형태의 문자열을 받아올 수 있게 하기위해서 {jsonData : JSON 형태의 문자열 }의 형태로 객체 리터럴을 만들어 전달을 했다.

그러므로 getparameter(jsonData) 를 해서 JSON 형태의 문자열을 받아온다.

String 타입으로 받아온 데이터는 아래와 같이 {: , : , : , ..}의 형태이다.


키들의 값들을 각각 뽑아와야 하는데, 현재 상태에서는 String클래스의 split()메서드를 사용하여 일일이 토큰을 잘라와야 값을 뽑아올수 있기 때문에 '키:값' 쌍이 많아지면 이 작업이 매우 힘들어진다. 

따라서 JSONObject.fromObject(getparameter(jsonData)) 메소드를 사용해서 JSON 형태의 문자열을 JSON 타입의 객체로 만들어주면, '만들어진 객체.get(키)' 로 값들을 뽑아올수 있기 때문에 더 간단해 진다.

참고로 JSON 라이브러리는 몇 가지 종류가 있는데 여기서는 net.sf.json-lib 를 사용하였다. 즉, 이 예제에서는 해당 라이브러리에서 제공하는 메소드들만을 이용하여 JSON 데이터를 핸들링하여야 한다.

 


-- 어쨌든 서버에서 JSON형태의 문자열 받아와서 그 안의 값들을 읽어오기 성공.