[JSON] JSON으로 비동기 요청 하기
·
비동기 요청/JSON
JSON (JavaScript Object Notation) : JSON은 좀 더 쉽게 데이터를 교환하고 저장하기 위하여 만들어진 텍스트 기반의 데이터 교환 표준이다. JSON 구조 JSON은 자바스크립트의 객체 표기법으로부터 파생된 부분 집합이기에 JSON 데이터는 다음과 같은 자바스크립트 객체 표기법에 따른 구조로 구성된다. 1. JSON 데이터는 이름과 값의 쌍으로 이루어져 있음 . 2. JSON 데이터는 쉼표(,)로 나열. 3. 객체(object)는 중괄호({})로 둘러쌓아 표현. 4. 배열(array)은 대괄호([])로 둘러쌓아 표현. [{"name" : "aaa", "num" : 1, "tel" : "111"}, {"name" : "bbb", "num" : 2, "tel" : "222"}, {..
[AJAX] get, post 방식으로 비동기 요청 하기
·
비동기 요청/AJAX
▶ 사용자에게 보여 줄 jsp 페이지 구현 name : 동기요청 버튼을 누르면 form 의 action 주소의 get 방식으로 이동하여 페이지 변환의 작업을 수행 하게 된다. 페이지의 이동이 있는 것이 동기 요청이고 나머지 방법은 비동기식으로 페이지의 이동 없이 바로 전환 되게 된다. ● GET 방식 비동기 요청 함수 구현 function a () { 1. 비동기 요청 객체를 생성한다. const xhttp = new XMLHttpRequest(); 5. 비동기 요청 응답이 왔을 때 실행 될 핸들러 함수를 등록한다. xhttp.onload = function(){ 6. 비동기 요청을 받으면 해당 응답을 프린트 해줄 공간을 g..
[AJAX] AJAX 기초
·
비동기 요청/AJAX
Ajax (Asynchronous Javascript And XML) : Ajax는 HTML, CSS, 자바스크립트, DOM, XML 등 기존에 사용되던 여러 기술을 함께 사용하는 새로운 개발 기법으로 웹 페이지 전체를 다시 로딩하지 않고도, 웹 페이지의 일부분만을 갱신할 수 있게 해준다. 즉 Ajax를 이용하면 백그라운드 영역에서 서버와 통신하여, 그 결과를 웹 페이지의 일부분에만 표시할 수 있게 된다. 웹 동기 요청과 웹 비동기 요청 동기요청 : 코드가 순차적으로 실행되며, 한 작업이 완료될 때까지 다른 작업이 대기해야 한다. 이러한 방식은 간단하고 직관적이지만, 작업이 길어지면 실행 속도가 느려지고, 작업이 차단될 가능성이 있다. 쉽게 말해 요청을 보내면 응답페이지를 받아와서 전체 페이지가 바뀌는 ..
[MVC 실습] 로그인하고 게시판 운영하기_6
·
MVC/MVC 모델 실습
⑥ 글 상세 보기 페이지 구현 하기 ${vo.title} 위의 a 태그와 하이퍼링크로 게시글의 타이틀을 클릭하면 해당 글의 상세 보기가 가능해진다. 아래는 상세보기 페이지이며 이 페이지는 servlet의 doGet을 통해 구현 되었다. ▶ servlet (board/detail) 코드 구현 하기 package board.controller; import java.io.IOException; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.ser..
[MVC 실습] 로그인하고 게시판 운영하기_5
·
MVC/MVC 모델 실습
⑤ 게시판에 글 작성 하기 글작성 ▶ servlet (/board/insert) 작성 package board.controller; import java.io.IOException; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servlet.http.HttpServletResponse; import javax.servlet.http.HttpSession; im..
[MVC 실습] 로그인하고 게시판 운영하기_4
·
MVC/MVC 모델 실습
④ 게시판 메인화면으로 이동하기 게시판 보러가기 해당 버튼을 누르면 a 태그에 의해 아래의 servlet 주소로 이동 하게 된다. ▶ servlet 페이지 구현 package board.controller; import java.io.IOException; import java.util.ArrayList; import javax.servlet.RequestDispatcher; import javax.servlet.ServletException; import javax.servlet.annotation.WebServlet; import javax.servlet.http.HttpServlet; import javax.servlet.http.HttpServletRequest; import javax.servl..
해니01_15
코딩구르르르