- 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형태의 문자열 받아와서 그 안의 값들을 읽어오기 성공.
'프로그래밍 언어 > Javascript' 카테고리의 다른 글
동적으로 생성된 태그에 이벤트 걸기(event delegation), 링크 막기 (0) | 2016.08.05 |
---|---|
폼 유효성 체크-javascript 정규표현식 이용 (0) | 2016.08.03 |
hoisting (0) | 2016.03.26 |
javascript의 closure (0) | 2016.03.26 |
javascript에서의 var 이용 유무에 따른 변수 scope (2) | 2016.03.26 |